• Gender: Female
  • From: San Antonio, TX
  • Registered: 2008-12-19
  • Posts: 3,640

Topic: #header h1 - margin top not cooperating

This is downright embarrassing, but I cannot figure out what's going on here:

http://tiny.cc/lw7DK

I am trying to move the h1 in the header down a bit - but every time I add a margin top to my #header h1 CSS, the ENTIRE header moves down - it's putting the margin to the #header, not just the #header h1.  I know I'm a bit rusty, but this is ridiculous.  I've checked everything and see nothing wrong.

#header h1 --- as far as I know, should ONLY affect the h1 inside my header div and NOTHING else.  And strangely enough - adding margin-top to my #header h2 only affects the h2 inside the header and NOT the entire header...

and btw - this is a work in progress - I'm working on the formatting as we speak.

EDIT
I've added padding-top and that works - but I'd still like to know what's going on with the margin-top.

Last edited by Andrea (formerly Thelma) (2009-11-07 10:19:11)

  • Registered: 2009-01-13
  • Posts: 486

Re: #header h1 - margin top not cooperating

The #header div has a set height of 200px and giving the h1 too much margin-top will force the h1 margin above the overall height allowed for the #header div. The #header cannot contain all the stuff you have added, (img, h1, h2, etc), so it expands upwards.

  • Gender: Female
  • From: San Antonio, TX
  • Registered: 2008-12-19
  • Posts: 3,640

Re: #header h1 - margin top not cooperating

Of course it had to be something simple...

Thanks.