Have you ever been frustrated by styling a page for then realize that every image contains a white line underneath, I saw this trick on Youtube and tried it with Joomla. The result was that line disappeared. This issue resides from the early internet when we've to use inline images in the text.


IN INternerts early days it was very common to use images inside a text, back then there was eighter Desktops or Laptops that were used as surf method. The internet has evolved since those days, and we now use images on top of the text. Therefore it's very useful to hide the line that displays under the image. Here are two examples that show this:

 

 Earlier:

Image with white line under

This was how images displayed shown on a website without adding the new CSS property. The border is showing whitespace.

NOW:

Image with no white line under, css fix

 The trick is to set the image to display block.

img {
display: block;
}

 Thanks to Kevin Powell and this video on Youtube, that showed this.

 

Comments wanted

- LET ME KNOW IF YOU KNOW ANY OTHER WAYS TO DO THIS IN THE COMMENTS BELOW -

No comments

Leave your comment

In reply to Some User

nordvpn