Search code examples
cssimagemargin

Why does a simple image get a margin-bottom c.q. output space under the image?

Please have a look at this simple jsfiddle. It contains the following code:

<div style="background:yellow; display:inline-block;">
    <img src="http://www.wedesoft.de/test/test.png" />
</div>

As you can see, this will output a space under the image so that you can see the yellow colored container. I do not know why, because no space was defined.

Can somebody tell me what is going on please?

Solution

  • For some reason 

    display:block;

    solves this problem as you can see in the accepted answer here: Remove white space below image

    Is still do not know why...