Why after adding a div, the style of the second block becomes the same as the style of the first?

http://jsfiddle.net/rJKn5/3/

HTML

<div id="inside"> <a href="#"></a> <a href="#"></a> <!-- <div></div> --> </div>

CSS

 #inside { overflow:hidden; outline:1px solid black; width: 443px; margin: 10px auto; } #inside a { display: block; background: #0000FF; float: left; width: 140px; height: 52px; } #inside a:last-child { background: #FF0000; margin-left: 79px; }

    1 answer 1

    Because the last <a> stops falling under the selector a: last-child

    Try to wrap the link in a block, like this