Forum Moderators: not2easy

Message Too Old, No Replies

How do you re-add margin/padding (Best Practice)

after removing them with * selector

         

andrewperk

11:44 pm on Feb 6, 2009 (gmt 0)

10+ Year Member



I was wondering if there's an actual "best practice" for re-adding the margins and paddings back into your pages(your paragraphs, headings, lists and such) after you remove them at the start of building a page with the * {margin:0; padding:0; )selector?

How do you guys go about doing it? Do you just target all tags like p, h1, h2, h3, ul, ol, etc individually and then add a margin-top or something to it? Or are you wrapping it all in another div and applying the padding to that div to move it away from the actual wrapper or containing div?

I had been applying the padding/margins to my content and sidebar divs themselves to move them away from the outter container div but I hear this is not the best way to do that when they are floated because it causes problems with other browsers, which I have noticed.

Thanks.

[edited by: swa66 at 8:49 am (utc) on Feb. 7, 2009]
[edit reason] unintentional smiley [/edit]

swa66

8:55 am on Feb 7, 2009 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



I reset it to gain control as some browser by default use e.g. padding while others use margins by default on a list. I've done this so long that I've long since forgotten which does what by default.

To add whitespace again you have 2 choices: padding or margin as you indicate. The 2 differences that make me choose are:
- backgrounds: margins do not enlarge the background, while padding does
- collapsing: margins can collapse, and if you look at plain text with p, h1, h2 etc. that does make a lot of sense

As for problems in IE < 8 : that's what you got conditional comments for.