Want a new VS Code theme?

CSS: Eliminating space under images

January 16, 2017

Space Under Image

Under certain circumstances, additional space is added beneath images. While it’s terrible for OCD, it’s pretty easy to fix.

img {
  vertical-align: middle;

Browsers render images inline which adds space for letters and their descenders to the line. You can also change your image to display: block to fix the issue.

I recommend making the selector slightly more specific than my fix above (like .containerElement img) to avoid any alignment errors for the rest of the images on your site.