DEV Community

Abhijit Ezhava
Abhijit Ezhava

Posted on

display: inline magic space!

Ever wondered when you adding a image to a HTML, you might find little space around it. It's not border, margin, padding, width or height; than what is it.

In html, images are treated as inline by default, so image's are generally text in mind of html and as usual text has spacing between them. The addition height is because of the line height, which can be removed by adding this line-height: 0 or making the image tag to display: block. I personally like the first approach as this doesn't change the flow of the element.

Top comments (0)