Welcome to WebmasterWorld Guest from 54.196.244.206

Forum Moderators: not2easy

Message Too Old, No Replies

Margins in HTML and BODY

What's the difference?

     
11:46 pm on Sep 29, 2003 (gmt 0)

New User

10+ Year Member

joined:July 23, 2003
posts:34
votes: 0


I was looking at some CSS code for a very well designed site, and ran across this early code...


html {
margin: 0px;
padding: 0px;
}
body {
font: 9pt/17pt georgia;
color: #555753;
margin: 0px;
padding: 0px;
}

What exactly is the difference between taking away the margins/padding in the <body> compared to taking away the same thing in the <html>, why would it be neccessary to define both?

And also one more thing I just noticed... What exactly does the 9pt/17pt do to the font? Why two values?

12:15 am on Sept 30, 2003 (gmt 0)

Preferred Member

10+ Year Member

joined:May 24, 2003
posts:381
votes: 0


Some browsers seem to give the html padding and margin (I think, can't remember for sure :) )

As for the "9pt/17pt": the first value is font-size, the second value is line-height.

2:42 am on Sept 30, 2003 (gmt 0)

Junior Member

10+ Year Member

joined:Sept 27, 2003
posts:156
votes: 0


yeah I ran into this last week. IE, NS, and Mozilla don't seem to add any margin to the html tag, but Opera does. that html { padding: 0; margin: 0; } will take care of unwanted margins in Opera and any other browser that puts margins on the html tag.
2:39 pm on Sept 30, 2003 (gmt 0)

Preferred Member

10+ Year Member

joined:May 1, 2002
posts:351
votes: 0


What exactly is the difference between taking away the margins/padding in the <body> compared to taking away the same thing in the <html>, why would it be neccessary to define both.

For forward compatability.

Technically, the root of the document tree [w3.org] serves as the initial containing block [w3.org] for layout on the canvas. Since this is the html element in web documents, some browser manufacturers (i.e., Opera) seem to have decided to define the default margin/padding of the viewport in their default browser stylesheet on this element. Others define it on the body for backward compatability reasons (the body has traditionally been used as the initial containing block for the purposes of displaying documents in the viewport).

Since the W3C recs leave it up to browser manufacturers to do this, defining zero margins on both the html and body is insurance on the part of the web developer.

6:05 am on Oct 1, 2003 (gmt 0)

Administrator from JP 

WebmasterWorld Administrator bill is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:Oct 12, 2000
posts:14471
votes: 49


SuzyUK made an interesting comment in message #30 of this thread [webmasterworld.com]:
* {padding: 0; margin: 0; border: 0;}

is a better catchall
then I set them to what I require as I go on..
The more I thought about this the more it seemed like a good idea to force everything to zero and then set your own widths. This may not override everything in all browsers, but it may be good practice so that at least you know you're not at the mercy of some browser's default display properties.
 

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week

Featured Threads

Free SEO Tools

Hire Expert Members