newcoder
newcoder

Reputation: 378

Why is there a gap underneath my header in IE?

I just started building a website http://preview.hksenet.hk in HTML5 and CSS.

But, I can't figure out why there is a big gap right under the header in IE. Can anyone help?

Upvotes: 2

Views: 114

Answers (1)

thirtydot
thirtydot

Reputation: 228162

The problem is to do with #searchmenudiv.

You can fix it by:

  • Setting position:relative on #pageheader.
  • Setting position:absolute; top:0; right:0 on #searchmenudiv.

Read more here: http://css-tricks.com/791-absolute-positioning-inside-relative-positioning/

In general, that's a more robust technique for what you're trying to do than using position:relative; top:-116px. For example, if you ever changed the height of the header, you'd have to update your -116px magic number. With my suggestion, #searchmenudiv will always be at the top right, no matter what.

Upvotes: 4

Related Questions