DEV Community

Cover image for Drop-shadow on clipped element - CSS Only
Atif Riaz
Atif Riaz

Posted on

Drop-shadow on clipped element - CSS Only

Drop-shadow is one of CSS Filter and by using this We can create a drop shadow for every clipped element by applying a drop-shadow filter to the element's parent. Pretty cool!

Drop-shadow is one of CSS Filter and by using this We can create a drop shadow for every clipped element by applying a drop-shadow filter to the element's parent

Drop-shadow is one of CSS Filter and by using this We can create a drop shadow for every clipped element by applying a drop-shadow filter to the element's parent

In the attached image you can see clearly that every element has a drop shadow and I just applied drop shadow only once to their parent.

Code + Demo ๐Ÿ‘‡

Note: CSS filters (including drop-shadow) are supported in all modern browsers.

Top comments (0)