Help plz CSS (box shadow)

Question

In this program box-shadow property is not working(on class child-one).
I know that it is because of clip-path property.
So help me to give that box(child-one) a shadow with original shape.
If i can't use box-shadow with clip-path property then how to achieve that shape with box shadow

https://code.sololearn.com/WlLCJ72ad7v0/?ref=app

Answer 1

A workaround is to make an identical element below the targeted element, with some shift and maybe little zoom to be the explicit shadow element rather than an implicit one (under the hhod the box-shadow property create elements to render it).

Add:

<div class="child-one c1-shadow"></div>

in your html, just before your actual 'child-one' element, and these to the css:

.c1-shadow {
background:black;
opacity:.3;
transform:translate(5px,10px) scale(1.01);
}