X
269670

Set Event top border border radius to 5px

For some strange reason I can’t seem to change the CSS to change the border radius of the event top “cards” (event items made from the list shortcode). They are now set to 20px, but I want to change it to 5px instead. Which css selector should I use for that?

See the attached image in the next reply to this post..

BY: Henrik Solkær - Feb 22,2022 AT 6:15AM - 3 years ago
    • Henrik Solkær Feb 22,2022 AT 6:16AM - Posted 3 years ago - #269671

      Here is the screenshot with further explanation..

    • Kenneth Feb 22,2022 AT 8:05AM - Posted 3 years ago - #269685

      Hello Henrik,

      You can use the custom CSS code below:

      .ajde_evcal_calendar.boxy.boxstyle1 #evcal_list .eventon_list_event .desc_trig{border-radius:5px;}

    • Henrik Solkær Feb 22,2022 AT 4:52PM - Posted 3 years ago - #269746

      Hi Kenneth,

      That does not work. It’s doing something, but not changing the border radius to 5px. I tried applying border-radius: 0; to the same css selector – then the corners should be totally square, but still it’s 20px.. Also, if you look carefully, it does change something to the border radius so you can see a small part of the background behind it..

      Check out the attached screenshot>

    • Henrik Solkær Feb 22,2022 AT 10:53PM - Posted 3 years ago - #269750

      I fixed it.. There are sooo many selectors setting the border radius… Not super good practice when writing CSS.. Should be much simpler.. This is what I have to do to make it work:

      .eventon_sorting_section, .evo_cal_above span, .eventon_filter_line .filtering_set_val, .eventon_sort_line .eventon_sf_cur_val p, .eventon_sorting_section p.evo_filter_submit, .eventon_filter_dropdown, .ajde_evcal_calendar .evo-sort-btn .eventon_sort_line, .ajde_evcal_calendar.boxy .eventon_list_event.hasbgimg, .ajde_evcal_calendar.boxy.boxstyle1 .evo_boxtop, .ajde_evcal_calendar.boxy.boxstyle2 .evo_boxtop {
      border-radius: 5px !important;
      }

    • Henrik Solkær Feb 22,2022 AT 11:08PM - Posted 3 years ago - #269751

      Ok.. I’s really hard to find all the selectors, so I kind of gave up.. Although I managed to do it on the blue bar containing the date and title etc…

      Now I am trying to make all round corners on the event page – event card have a 5px border-radius..

      Can you find a selector that changes the image, the grey content boxes – all of them – so they all have a 5px. border radius?

      Here is a link to an event page: https://gastroclass.dk/events/moderne-klassiske-gourmetretter-10-marts-2022/

      Please see the attached image where I try to illustrate what it is I need.

       

    • Kenneth Feb 22,2022 AT 11:19PM - Posted 3 years ago - #269753

      Hello Henrik,

      Please use the code below:

      .evocard_box{border-radius:5px;}

      Let me know if that works for you.

    • Henrik Solkær Feb 23,2022 AT 12:46AM - Posted 3 years ago - #269755

      That took care of the grey boxes.. Not the image and top.. But I figured out those now.. Thank you Kenneth 🙂

    • Kenneth Feb 23,2022 AT 2:13AM - Posted 3 years ago - #269765

      You are very much welcome Henrik 🙂 As always, please feel free to create another ticket of you have any other issue, we are happy to help!

You must login to reply to this ticket

HelpDesk

Welcome to EventON helpdesk.

EventON is the #1 Best selling event calendar plugin for WordPress websites in envato marketplace.

Checkout EventON