HTML Remove Img Padding (display: block not working)

Question

HTML Remove Img Padding (display: block not working)

148 views Asked by Frank At 07 December 2024 at 11:43

How can I remove the padding from an . The style "display: block" (mentioned in many other solutions) doesn't seem to solve the problem.

<!DOCTYPE html>
<html>
<head>
    <style>
        img {
            display: block;
            width: 100%;
        }
    </style>
</head>
<body>
    <img src="https://imgur.com/CahbpxJ.jpg" width="100%">
</body>
</html>

Original Q&A

There are 2 answers

batgerel.e On 09 February 2018 at 10:04

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

*::after, *::before {
  box-sizing: inherit;
}

**Frank** · Accepted Answer · 2018-02-09 09:33:10

Frank On 09 February 2018 at 09:33 BEST ANSWER

Answer from CBroe's comment. The body tag has its own default margin. To fix the problem add this in the style tag:

body {
    margin: 0;
}

TechQA.

HTML Remove Img Padding (display: block not working)

There are 2 answers

Related Questions in HTML

Related Questions in CSS

Popular Questions

Popular Tags

Trending Questions