Search code examples
cssoverlapping

Overlapping box-shadow with float divs

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.
Solution

  • You need to change the display of the li.child so that the contents of div.content do not escape it.

    Add this CSS :

    li.child { display: inline-block; }

    http://jsfiddle.net/stevendwood/LtZAv/2/