Unexpected blank space between div tags

css, html

Solution

It's the image tag that does that.

Make the image a block element, and it will fix the issue.

#background { display: block }

Problem

I wonder why I'm getting a blank space between two `div` tags. This is the HTML code: ``` <div id="header"> <img id="background" src="http://farm3.staticflickr.com/2847/11154210265_a8854fe5c5_h.jpg" alt="background" /> </div> <div id="menu"> Why the above blank space? </div> ``` And the CSS: ``` * { margin: 0px; padding: 0px; } #background { max-width:100%; max-height: 550px; } #menu { background: rgb(170,200,189); } ``` You can see the behavior here: JSFIDDLE

Original source

Related problems