Jump to content

Index Page Images won't round

Recommended Posts

I'm looking to round the corners of the the index page image blocks but I'm running into difficulty. So far, using the bit of code below, I've gotten the images' corners to round when you hover over them, but I'd like it to be that way even if someone isn't hovering over the image.


.index-item.has-item-image {
    border-radius: 20px !important;

Does anyone have any suggestions on how to make the corners stay rounded without hovering over them?


 940395356_ScreenShot2022-03-16at3_50_36PM.png.7aa0dd3f3c7b5c7444afab5b2c0bb06b.png    461412274_ScreenShot2022-03-16at3_50_41PM.png.8054fa6875ad96c901ebce3e6d2f1b62.png

Link to comment
  • Replies 4
  • Views 238
  • Created
  • Last Reply

Top Posters In This Topic

On 3/19/2022 at 6:06 AM, GalPal1 said:

Absolutely! Here is a link to the page: https://www.jadewilburndesign.com/

Use this new code

.index-item.has-item-image, .index-item.has-item-image>a {
    border-radius: 20px !important;


Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.