Weird problem with IE

Hi all,

Can anybody explain why i am having this weird problem with IE and not firefox.

If you take a look at http://www.postboxgames.com/bomberman-p-95.html and click the "screenshot" tab you will notice that in IE the images do not display, they are there and you can click on them to enlarge.

In firefox it works fine

This is the code i am using to do the display

   <div class="tab-page" id="SCREEN">
      <h2 class="tab">Screenshots</h2>
      
<div class="screenshotsBlock">
<?php include(DIR_WS_MODULES . 'dynamic_mopics.php'); ?>
</div>

   </div>

Code (markup):

and this is the css i am using

.dynamic-tab-pane-control .tab-page {
clear:both;
border:1px solid rgb( 145, 155, 156 );
background:rgb( 252, 252, 254 );
z-index:2;
position:relative;
top:-2px;
font-size: 11px;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
color:Black;
padding:10px;
}

Code (markup):

.screenshotsBlock {
padding: 0;
margin: 0;
text-align: center;
}

Code (markup):

.screenshots {
float: left;
width: 33%;
padding: 5px 0 5px 0;
margin: 0;
text-align: center;
clear: none;
}

Code (markup):

I have been banging my head against the wall with this problem for ages now and just cant seem to resolve it.

Any help is greatly appreciated

Thanks

 

Ah that looks like a pesky problem. Looking at your HTML...it looks just a bit ugly. I couldn't even run it through W3's validator. After editing it, I came out with 117 errors. You might want to work on sorting those out. Anything out of line can cause IE to act strangely.

 

The SCREEN div seems to be blocking the rest of the content. Try adding background-color to its style:

<div style="display: block; background-color: transparent;" class="tab-page" id="SCREEN">

 

CompressedAir, yes i know how bad the code looks and that it dont validate. But it is something i have on my to do list and hopefully will be able to tidy it up.

J.D. Thanks alot that did the trick!