Probs with coding - Firefox OK, IE not ... help!

Hello folks

Have just done a MAJOR overhaul on my site www.udzungwaforestcamp.com Despite my best efforts so far with CSS, while the site is (mostly) OK in FF and Chrome it is simply a mess in IE. The heading bar containing the table of images at the top won't render correctly in IE. Here's my html code - can anyone help? Thanks!

<div id="logos">
<table>
<tr>
<td class="logostd">
<a href="/" title="Mountain view " >
<img class="topimageleft" alt="x - Mountain view"
src="/localimages/udzungwa_mountain_view.jpg">
</a>
</td><td class="logostd">
<a href="/" title=" Udzungwa Tree Frog" >
<img class="topimageleft" alt="Udzungwa Tree Frog"
src="/localimages/udzungwa_mountains_sanje-treefrog.jpg">
</a>
</td><td class="logostd">
<a href="/galleryindex" rel="nofollow" title=" - Sanje waterfall" >
<img class="topimageleft" alt="Sanje waterfall"
src="/localimages/udzungwa_mountains_sanje_waterfall-top_slide.jpg">
</a>
</td><td class="logostd">
<a href="/" title="Udzungwa Forest Camp" >
<img id="logoimage" alt="Udzungwa Forest Camp"
src="/localimages/udzungwa_forest_camp_logo.jpg">
</a>
</td><td class="logostd">
<a href="/galleryindex" rel="nofollow" title="Tree frog" >
<img class="topimageleft" alt="Hornbill"
src="/localimages/Udzungwa_Hondo_Hondo.jpg">
</a>
</td><td class="logostd">
<a href="/galleryindex" rel="nofollow" title="<TMPL_VAR
NAME="TITLE"> - View from Sanje" >
<img class="topimageleft" alt=" - View from Sanje"
src="/localimages/udzungwa_mountains_view_from_sanje.jpg">
</a>
</td><td class="logostd">
<a href="/" title="<TMPL_VAR NAME="TITLE"> - Udzungwa Red Colobus
Monkey" >
<img class="topimageright" alt="Udzungwa Red Colobus monkey"
src="/localimages/udzungwa_mountains_red_colobus.jpg">
</a>
</td></tr></table>
</div>

 

well, I've looked ten times, cannot see a problem. Looks identical in IE and FF

Of course I haven't tried IE6, but then again, no webpage should have to work in a ten year old browser.

 

One of the best things you can do to help your site work in multiple browsers is to take the time to clean up your coding so it is valid. W3C is showing multiple errors and warnings both with your HTML and with your CSS. Getting your site valid may not fix every display issue, but it will sure head you in the right direction.

Beautiful pictures on the site!

 

I think you need to install the javascript that makes okay for all browser. just research them,.

 

I just looked at your site and I think you figured out the cross browser bug on your own. It looks like you replaced the table with divs. Which basically solves the problem you had earlier.

The reason why the table version wasn't working was the img needed to be a block level element and not inline. This tells IE they are blocks and hold a certain space.

Adding this to the CSS would have solved the issue with the code above.
.logostd img {display:block;}