CODEWITHSUNDEEP
javascripthtmlcssinternet-explorercross-browser
D-Nice
D-Nice

Reputation: 4870

Why does IE8 display a whitespace GAP between my menu bar and page content?

The page in question

Please open the page in whatever browser you normally use and confirm that the menu bar immediately precedes the map. Next, open the page in IE8 and see that it inserts whitespace (roughly the height of the menu bar). Even if you use IE7, the whitespace doesn't appear. This has been bothering me for a while and I haven't been able to find an adequate solution.

Thanks.

Upvotes: 0

Views: 601

Answers (3)

babtek
babtek

Reputation: 944

You have not explicitly set margins for header tags but you are using them in some of the supposedly hidden elements up there near your header. This should fix your issue:

h2 { margin: 0; }

Upvotes: 0

Marcelo
Marcelo

Reputation: 9407

And you want us to debug obfuscated javascript? :-)

All I can tell you is that

1) You're not using the (Google Maps v2) recommended DOCTYPE with a Strict DTD:

<!DOCTYPE html "-//W3C//DTD XHTML 1.0 Strict//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Ref: Google Maps API V2 Doc.

That will switch IE into "Standards Compliant Mode" (According to Microsoft, anyway)

2) Try using the IE7 compatibility tag:

<meta http-equiv="X-UA-Compatible" content="IE=7" />

That must be the first META tag and before any CSS. Even MS' own Bing maps use it. :-)

Upvotes: 1

C_Rance
C_Rance

Reputation: 661

U wanna try the IE compatibility view? I have no issue after using that. I tested w/o compatibility view and saw the space

Upvotes: 1

Related Questions