Jump to content

Drop Shadows on Images in Safari

Recommended Posts

Site URL: http://www.thepeak1group.com/home

Hi there,

I'm using the following CSS code (in Custom CSS under the Design tab, in a 7.0 Brine family site) to add drop shadows to specific images:

Quote

#BLOCK-ID-# { filter: drop-shadow(10px 10px 3px #a0a0a0)}

This works *perfectly* on Chrome and I never realized there were issues with it until working with a client this week who primarily uses Safari (I work on Chrome) -- he noticed that there were "breaks" in the drop shadows across the site where I'd used the code to create the shadows. I even tried a code to add drop shadows to ALL images universally (instead of using block IDs to isolate specific ones) and still ran into issues...but only on Safari.

Is there a fix for this? Or something that needs to get added/edited/removed from the code that would enable Safari to recognize it and implement it correctly? Or another code entirely that would help Safari read it correctly? This is my first time running into cross-browser issues.

Attaching an image from each browser for a "shadow break" example.

Thanks so much!

Safari Image.png

Chrome Image.png

Link to comment
  • Replies 2
  • Views 2.4k
  • Created
  • Last Reply

Archived

This topic is now archived and is closed to further replies.

×
×
  • 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.