1

Why does the body tag has a default margin while html does not have a default margin? Any practical reason?

Bootstrap4
  • 3,671
  • 4
  • 13
  • 17
  • Potentially useful reading https://stackoverflow.com/questions/2593106/styling-the-html-element-in-css. Also it depends on the browser's default stylesheet so this may not be the case in every browser. – CollinD Jun 01 '17 at 01:33
  • but why body has a margin? – Bootstrap4 Jun 01 '17 at 01:39
  • Basically because it make no sense to set default margin for both, body is the standard tag responsible for all visible/invisible contents, – Emad Dehnavi Jun 01 '17 at 01:51
  • The ultimate reason is likely only known to the persons/groups responsible for designing user-agent stylesheets in many common browsers. Everything else is basically speculation on their decision. – CollinD Jun 01 '17 at 02:04
  • 1
    Because of backward compatibility with web pages written before CSS was invented. To get the page to look the same as it would have been then, you need collapsing margins, so the default spacing had to be margins, not padding. And margins on the `` element didn't work well in many browsers until relatively recently, so it had to be the `` element. – Alohci Jun 01 '17 at 06:20

1 Answers1

1

Browser's set default style sheets. Body tag is the parent for all your visual elements that's why margin is set on body and not on html.

The reason why they are set is due to accessibility. If a web user decided not to load user css then the content should still be presantable.

This is in w3c spec.

Reference https://www.w3.org/TR/CSS21/conform.html#conformance

karthick
  • 11,998
  • 6
  • 56
  • 88
  • The question is not why does `` have a margin (and not ``)?. It's ***Why it has a margin*** (when it makes no sense to have one)? It makes sense to have `padding` but not `margin`. If one sets a `background-color`, it will look like it has a white border. Also, `` margin causes elements with `min-height:100vh` to create a scrollbar, when, in fact, they should not. In its current form, you are far from answering the question that has been asked, IMHO. Admittedly, it wasn't clearly formulated. – tao Jun 01 '17 at 02:02
  • @AndreiGheorghiu. Yes agreed. These rules are set during the initial w3 spec creation. And browsers have followed it from that time. No thoughts were given to it now to check whether it's required or not. – karthick Jun 01 '17 at 02:08
  • I believe the comment above does a better job at answering the question than your answer. But I might be subjective. Cheers! – tao Jun 01 '17 at 02:11