The question is similar to this one:
Extra spacing after an A Tag/img tag?
But the solution was to apply display:block to the image but if I do it, my vertical-align is lost.
<div class="main" style="display:table;"> <div style="display:table-cell;"> <img src="http://www.w3schools.com/images/w3logotest2.png" /> </div> </div>
img height: 32px, parent div height: 36px. Can’t find a way to remove it and keep
When you set your image to a block element you have to center it as a block element with
margin: 0 auto.
@Yoann’s solution also works, but the
flex value is not supported by every browser. Have a look at the MDN docs for more information about browser support and values of
Answered By – Eich