6

We're using a Html Wrapper supplied by a client, which references a reset style sheet that sets the <p> element's margin to 0px. I'd like to have a normal top & bottom margin with my <p> elements, so can somebody tell me what it should be?

DaveDev
  • 41,155
  • 72
  • 223
  • 385
  • 1
    http://www.w3.org/TR/CSS21/sample.html – reisio Jul 16 '10 at 20:08
  • You might want to check [this question on the same thing](http://stackoverflow.com/questions/819161/what-is-the-default-padding-and-or-margin-for-a-p-element-reset-css). – derekerdmann Jul 16 '10 at 16:00

3 Answers3

7

Browser specific CSS defaults are outlined here.

Here's an extract of relevance for the margin of the p element:

  • W3: 1.12em 0
  • IE7: 14.25pt 0
  • IE8: 1em 0
  • FF2: 1em 0
  • FF3: 1em 0
  • Opera: 1em 0
  • Safari 3.1: 1em 0

Reset stylesheets are by the way ridiculous. Just set the desired margin yourself if you want it to be consistent among browsers.

p {
    margin: .75em 0;
}

See also:

Community
  • 1
  • 1
BalusC
  • 1,082,665
  • 372
  • 3,610
  • 3,555
  • 2
    +1 for the detail, but disagree with you on reset stylesheets. I find they save me time as I don't need to troubleshoot nearly as many browser inconsistencies. However, this benefit disappears if the site has need to optimize for high volume traffic. – kingjeffrey Jul 16 '10 at 22:11
  • FYI- your first [link](http://css-class.com/test/css/defaults/UA-style-sheet-defaults.htm) is dead with an Internal Server Error. – Sparky May 05 '11 at 23:26
  • 1
    @Sparky: Bug in their server code. If they don't fix it soon enough, check the [google cache](http://webcache.googleusercontent.com/search?q=cache:7KiUoJ9JPLoJ:css-class.com/test/css/defaults/UA-style-sheet-defaults.htm&cd=2&hl=en&ct=clnk&source=www.google.com). – BalusC May 05 '11 at 23:27
6

They're browser dependent. That's why most people use a reset sheet - to normalize them before they attempt to customize them.

g.d.d.c
  • 46,865
  • 9
  • 101
  • 111
  • Is there a margin that *most* browsers use? – DaveDev Jul 16 '10 at 15:58
  • No, there is no set requirement or 'standard'. My advice would be to keep the reset sheet, and then set your top and bottom to what you want to see. – g.d.d.c Jul 16 '10 at 15:59
  • 1
    “No, there is no set requirement or 'standard'” — that’s not exactly what was asked though. I think most browsers use 1em. Like most use 16px as a default font size, and 1.2 as a default line height. – Paul D. Waite Jul 16 '10 at 16:06
  • http://css-class.com/test/css/defaults/UA-style-sheet-defaults.htm has a (non-exhaustive) list of default styles applied by a variety of browsers. But yes, personally I'd simply reset these to my own values, not try to second-guess the browser. – Matt Gibson Jul 16 '10 at 16:10
0

The default margin is 1em, as suggested in HTML5.

Ms2ger
  • 15,596
  • 6
  • 36
  • 35