Debut Theme Breaking When I add Box Shadow

Store Design
1

I am trying to add a bit of box-shadow to my site nav dropdowns.

When I add this line of code, the CSS breaks for some reason and the site doesn’t render any.

box-shadow: rgb(0 0 0 / 30%) 0px 19px 38px, rgb(0 0 0 / 22%) 0px 15px 12px;

Any ideas why this would break the site?

2

@Slushy_Sam - you are adding 2 lines of property, remove one and check

3

Still breaks. It’s super weird, works like a charm when I add the effect on web tools. But breaks the CSS when added to the code itself.

4

Apparently, switching the shadow from RGB to RGBA helped resolve this. Not sure why at all. Here’s the code that ended up working.

box-shadow: rgba(0, 0, 0, 0.30) 0px 19px 38px 0px, rgba(0, 0, 0, 0.22) 0px 15px 12px 0px;