Why it is not matching padding and border?

HTML-CSS
1

p {
border: 2px solid powderblue;
padding: 30px;
margin: 50px;
}
why this padding and margin is not matching?

2

Not exactly sure what you mean?

3

Hi ,

Padding and Margin are different.

  • Content - The content of the box, where text and images appear
  • Padding - Clears an area around the content. The padding is transparent
  • Border - A border that goes around the padding and content
  • Margin - Clears an area outside the border. The margin is transparent

image
image1920×1080 69.4 KB

4

so in what order should I arrange padding and margin and border please explain to me? otherwise, what is the alternative?

5

I would suggest watching a few youtube videos on CSS Box Model, they will explain everything nicely

6

Hi @prashanthpalaparthi1,

Margin and Padding are mainly used for spacing.

Kindly google CSS Box Model or watching a Youtube video as suggested by @Jaydog will give you a more clear picture.

7

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.