Extra Space in IE7

[Dragonkai]

Here if you look at the site in IE7, there is a horizontal scrollbar. While in FF, Opera, Safari there isn't. Even IE6 doesn't render the whitespace to the right!

I checked my code, I don't know why IE7 is rendering the extra whitespace.

See attachment.

[WebJoel]

I am still ascertaining the problem, but this needs to be addressed:

<img alt="" src="images/leftban.png" style="position:absolute; left:0;" />
<img alt="" src="images/rightban.png" style="position:absolute; right:0;" /> When using "position:absolute;", you most definately want & need to explicitly state a second value, not just "left:0" and "right:0;". When I wrote this for you, I had "top:value;" included for this very reason. State also "top:0;" else IE will make random wild guesses as to what & where you want done...

Never underestimate the dumbness of IE... Who knows... this might in fact be the whole problem! :eek:

And to this, add:

<style>

body, html {width:100%; background-color:black; padding:0; margin:0;}
</style> (in case you removed the " * {padding:0; margin:0;} " You NEED to remove the IE-default padding & margin, else things will always look different in IE).
...there is a horizontal scrollbar. You mean vertical, don't you?


A quick-fix (which might be problematic later on...), is this:

<style>

body, html {width:100%; background-color:black; padding:0; margin:0; overflow:hidden;}
</style> but this might work against you later on...

[Dragonkai]

Nope, I really mean horizontal bar... (See screenshot.)

and here's the updated file... (See attachment)

BTW I do have padding:0 and margin:0, it's on the very top of body.css

[WebJoel]

What version of IE is doing this? IE6? I only have IE7, and Firefox and IE7 has no horizontal scrollbar but instead, a greyed-out vertical scrollbar... :confused:

[Dragonkai]

Wow really? I'm using IE7 and there is a horizontal scroll bar....

my resolution is: 1440 by 900.

However in IE6, there isn't a horizontal scrollbar...

[WebJoel]

IE7 here, albeit I ran that from Firefox's "IEtabs" and while switching to the (cough-cough!) Trident rendering engine is often painful enough, some rare occasions it doesn't actually show EXACTLY what IE-proper might...
And, it does use the current installed version of IE (in my case, IE7) for it's source...

[WebJoel]

I re-downloaded your *zip and tonight, it acted the way you described... :confused:

anyway, -try this:

<div id="footer">

<img id="leftfooter" alt="" src="images/leftfoot.png" />
<img id="rightfooter" alt="" src="images/rightfoot.png" />

<p style="width:50%;"><em>Copyright © 2008 Army of Darkness - Non Profit Gaming Clan, except where stated.</em></p>

</div>

[Dragonkai]

Awesome thanks it worked...

but why...?

[WebJoel]

Mine is not to reason why... :p