From the course: CSS: Images

Unlock this course with a free trial

Join today to access over 22,600 courses taught by industry experts.

Getting rid of the space underneath an image

Getting rid of the space underneath an image

From the course: CSS: Images

Getting rid of the space underneath an image

- [Instructor] The image element is inline by default, and this introduces a weird little quirk that even seasoned developers run across all the time. It's important to understand what is happening, how to fix it, and also why this is happening. So let me walk you through all these steps here. The quirk is if you add an image inside another container as I've done here, so I have an image element, and it's inside a div. You'll notice there's a little space on the bottom underneath the image, and this is neither padding nor margin or anything else. And when you see this, the knee jerk reaction is always to say, oh, there's margin around the image, so I'll go to the image and say margin zero. You do that, nothing happens. Okay? So maybe it's padding inside the containing element. So I'll go to the containing element and say padding zero. Again, nothing fixes this problem. In fact, you can mess around with the image or…

Contents