What is the purpose of setting the * unversal selector or setting padding and margin to 0 for the body?

views:

130

answers:

+1 Q:

What is the purpose of setting the * unversal selector or setting padding and margin to 0 for the body?

Hello,

I am not a designer, but I have noticed many chnages between firefox and internet explorer. I have been told that it is a good idea to set the universal selector's (*) padding and margin to 0 and the body's margin and padding to 0 as well. Is this necessary? Is setting both * and body's padding and/or margin necessary?

Thanks

+6 A:

Each browser has its own 'default' CSS values for each element type. Using the universal selector * to reset margins and padding to 0 removes any cross-browser inconsistencies that may result from the different default CSS values.

tj111 2009-02-05 20:06:57

is it redundat to set the * and the body's margin and padding to 0?

Xaisoft 2009-02-05 20:30:31

Yeah it is, since * also targets the body element.

tj111 2009-02-05 20:36:30

Is there a reason I would want to stay away from the * and use body instead?

Xaisoft 2009-02-05 20:47:09

If you only wanted to reset the margin/padding on the body but allow browser-default values on elements that you haven't defined margins/padding for.

tj111 2009-02-05 21:05:09

ok, after some further reading, it makes more sense, the universal selector is like a wildcard for all elements. Thanks for the help.

Xaisoft 2009-02-05 21:12:11

"...a reason I would want to stay away from the *..."Yes, using "* {padding:0; margin:0;} adversely affects styling of some form elements especially the SELECT element. Use at your own risk

Andy Ford 2009-02-05 22:10:25

+1 A:

Setting the body's margin and padding is there to avoid the default space between window edges and the HTML body. Your specific website design may need this or not; for example stackoverflow needs it for the gray box at the bottom. It is not needed to set it for * to accomplish that, as obviously the body settings will overwrite the * settings for the tag.

Altering * settings in a brutal way like this just removes sane defaults previously present for all the different tags out there. You should better only alter the CSS which directly bother you, for example to get rid of unnecessary space between specific elements. It's kinda like people giving an absolute default font size 10 for the whole page, which annoys users with special needs a lot.

ypnos 2009-02-05 20:09:33

Remember, kids, set all your styles !important for that extra accessibility denial. You spent way too much time positioning all your divs so that they align in the most fragile, unmaintainable possible way to let some jerk screw it up just because he thinks being legally blind makes him special.

chaos 2009-02-05 20:25:33

Is the space between window edges in firefox and ie different?

Xaisoft 2009-02-05 20:28:14

Thanks chaos for your satirical support.Xaisoft: I don't know how that space is defined. Most likely you may easily find two OS/browser setups where it differs.

ypnos 2009-02-05 22:06:38

+2 A:

Check out Yahoo's Reset CSS:

http://developer.yahoo.com/yui/reset/

Makes dealing with different browsers a lot easier.

Stefan 2009-02-05 23:56:14

ansaurus

tags:

views:

answers:

What is the purpose of setting the * unversal selector or setting padding and margin to 0 for the body?

related questions