Search code examples
htmlcssfirefoxfirebugstylesheet

Header Margin Not Specified Anywhere

I'm having an odd issue. I have a simple web page, and for some reason the <h1 /> tag is having a margin-top and margin-bottom of over 18px. There is nothing in my *.css file that specifies this. Firefox Firebug shows me the style that is applied, but there is no margin anywhere.

In the picture, the div that the header text is in (or supposed to be in) has the limits. But the header text is pushed down because of the margin.

What could be causing this?? Is there anywhere in firefox/firebug that can show me EXACTLY where that style came from? It says that the header tag inherited from the body style, but that is only this:

body
{
    font-size: .85em;
    font-family: "Trebuchet MS", Verdana, Helvetica, Sans-Serif;
    color: #232323;
    background-color: #fff;
}

Any ideas? Thanks in advance.

enter image description here

Solution

  • Headers often have a margin by default. Have a look at using a reset/normalization stylesheet.

    Reset or normalization stylesheets reset your styles to a standard baseline across all browsers. The difference between reset and normalization is that resets clear margins, padding, etc. where normalization stylesheets apply sensible defaults.

    These links should be of use: