White line between my hero and main sections
Hi all, trying to build a website for my sister's business. Just making a couple prototypes for the moment, and on this one I have a white line between the hero and main sections. It's a piece of body. ( I tried setting the body background color to red and the line becomes red).
Anyone have an idea what causes this? heres my codePen:
https://codepen.io/berdj/pen/OJqvyZw
(just changed the image and took one from the internet instead of a local file for better visibility, but the issue remains the same)
3 Replies
by default an image has a display of type inline. this to have it align better with inline text. the result is a bit of white space (the descender space). Making it a display: block removes that space
could you explain? 🙂
Okay, thank you! have a great day 😄
KPow explains better than I can
https://youtu.be/plOl7TNc89A?si=wsiLRba-R_gwBAot
Kevin Powell
YouTube
Get rid of that small space under your images
Interested in CSS Demystified? Sign up for the waiting list here: https://cssdemystified.com
That annoying space under your images is a leftover from the old days of the web, and it can drive you nuts! Luckily, it's really, really easy to fix!
It can be frustrating when little things like this happen. That space under the images is there for...