当前位置: 动力学知识库 > 问答 > 编程问答 >

css - white strip at top of HTML page, despite all margins, paddings, etc. set to 0

问题描述:

I have a white (actually, body color, ghostwhite) strip at the top of my HTML page, even though all margins, paddings, etc. etc. are set to 0.

URL: (edit: removed, because it's outdated)

I've thoroughly investigated everything I could think of, and I'm officially out of ideas what's causing this. The really strange thing is that I've copied the CSS from a test page and it works properly there, so I suspect any of boilerplate, modernizr, etc. that I use on the live page, but I've checked everything I could think of there and couldn't find a reason.

Firebug shows me that apparently the entire body is offset by exactly 2em. If I add a "top: -2em" to the CSS, it aligns perfectly with the top of the page. But that's at best a workaround and I'd like to understand what's going on here.

网友答案:

The issue is with the #logo DIV and the H1 element. Both have margins which (cumulatively) produce this white strip.

Remove the margin from the #logo element, and use padding for the H1.


Update:

Another way would be to:

  • remove margin from #logo
  • add padding to #logo
  • set margin:0 on H1
  • remove line-height:0.5em from #logo

Result:


Btw I recommend you to include YUI CSS Reset (or some other reset sheet) to your page.

网友答案:

You have a top margin on the h1 element.

h1 { margin: 0 0 10px; }
网友答案:

just add this to header class in css.

header {overflow: hidden;}
分享给朋友:
您可能感兴趣的文章:
随机阅读: