Overlapping box-shadow with float divs

Question

Code

http://jsfiddle.net/LtZAv/

What is expected

• top shadow of second .child .comment-box is displayed and overlapping the first .child .comment-box

What browser renders

• box shadow of second .child .comment-box in the region of div.content with float:right is not displayed.

Answer 1

You have to change the position of comment-box div to relative

like

.comment-box { position: relative; }

so shadow will overlap the first div.