Home>Support>Border radius on images won’t apply

Border radius on images won’t apply

By Steven Orloff, 9 years ago. Last reply by Andrew Misplon, 9 years ago.

Hi,
I wanted to round the corners of my images on my site, but I don’t want the drop shadow effect. I’ve tried just doing:

.entry-content img {border-radius: 5px 20px 5px;}

along with browser specific code also and it just won’t apply it. Any reason you can think of why?

Cheers,
Steve

URL: http://www.traditionalacupuncture.com.au/digestive-health/

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 9 years, 10 months ago Andrew Misplon
    Hi, I Work Here

    Hi Steven

    Try heading to Appearance > Customize > Page and turn Image Shadow and Rounding back on. Then use the following to remove the box shadow:

    /* Vantage Remove Image Shadow */

.entry-content img { -webkit-box-shadow: none !important; -moz-box-shadow: none !important; box-shadow: none !important }

    Then you can set your own border radius or use the themes. The problem is that when you turn off Image Shadow and Rounding the Customizer is inserting border-radius: 0 !important; into the page head. That’s overriding your CSS.

    You could also just try:

    .entry-content img {border-radius: 5px 20px 5px !important;}
  2. 9 years, 10 months ago Steven Orloff

    yep that worked a treat, cheers

  3. 9 years, 10 months ago Andrew Misplon
    Hi, I Work Here

    Super, glad that helps.

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More