"If a worker wants to do his job well, he must first sharpen his tools." - Confucius, "The Analects of Confucius. Lu Linggong"
Front page > Programming > How to Eliminate Image Spacing with CSS?

How to Eliminate Image Spacing with CSS?

Published on 2024-11-17
Browse:868

How to Eliminate Image Spacing with CSS?

Eliminating Image Spacing via CSS

In HTML, when multiple images are placed consecutively, a single whitespace appears between them. This can be visually disruptive in certain design scenarios. While numerous workarounds exist, such as manual line breaks or HTML comments, there is an elegant solution using CSS.

To effectively remove the whitespace between images, utilize the following CSS property:

img {
  display: block;
}

This property sets the display behavior of images to block-like elements, allowing them to occupy the entire available width of their container and align vertically. By doing so, the space between the images is eliminated, creating a seamless visual experience.

Latest tutorial More>

Disclaimer: All resources provided are partly from the Internet. If there is any infringement of your copyright or other rights and interests, please explain the detailed reasons and provide proof of copyright or rights and interests and then send it to the email: [email protected] We will handle it for you as soon as possible.

Copyright© 2022 湘ICP备2022001581号-3