Default size of padding and margin of a box model

What is the default size of padding and margin of a box model, in case we don’t specify its size in pixel? Here is the link to the CSS training module:

Hey there and welcome to the forums!! :slightly_smiling_face:

To my knowledge, most elements (if not all elements, as I don’t know any elements to have padding) have a default padding of 0, or no padding.
Likewise a good many of the elements have a default margin of 0. However for the elements that do have a margin, it can vary greatly depending on the element.

For example the <body> element usually has a default margin 8px, were as the <p> element has a default margin equal to the font-size and the <h1> element has a default margin directly related to the font-size. For a font-size of 16px the <h1> has a margin of 21.44px, and for a font-size of 18px it has a margin of 24.12px. The rest of the header elements also have default margin related to the font-size.
Then there are many elements that have a default margin of 0, like the <div> and <section> elements, or the <a> and <span>.

With so many different elements, remember you can usually use the developer tools to check the margin or padding of an element.

Also note that though most major browsers display elements with the same default margin and padding, they can be different. For the examples above I was using Google Chrome.

1 Like

Lists have default padding.