My site is OK in FF/Opera/Chrome/Safari but not in IE

**mmq2009** · 01-17-2009, 12:20 PM

hi ppl,

newbie here, and having some trouble with my first 'real' project...hope someone can shed some light over it...

my site so far renders as i want in all browsers apart from IE, IE just seems to 'throw' the tables all over the place, if you take a look at it

http://www.netuseservers.com/clients...gdom/index.php

the navigation on the left keeps jumping in IE but not in any other browser

, its not only the navigation the header changes size, some other other tables also change size

im stumped

p.s. what u think of the design?

**Snookerman** · 01-17-2009, 12:23 PM

You should really not use tables for layout/design, please take a look at this article:
http://www.hotdesign.com/seybold/everything.html

I know it's a pain to rewrite a site from tables to semantic html and css so I'll try to find a temporary solution for you until you manage to get rid of the tables.

Good luck!

**mmq2009** · 01-17-2009, 12:37 PM

thnx snookerman, but why is it happening and do i get started with this redesign...

would appreciate it if someone would post a little something, my navigation is CSS and most the styling is also CSS, the tables are there for separation

could be something really 'daft' and fixable and not do a complete redesign

**ModernRevolutions** · 01-17-2009, 12:50 PM

It looks exactly the same to me in IE as it does in Mozilla.

**mmq2009** · 01-17-2009, 01:02 PM

Originally Posted by IllustriousLyts

It looks exactly the same to me in IE as it does in Mozilla.

doesn't the left navigation jump down on the index page?

im using ie7, and the ietab with FF3

**ModernRevolutions** · 01-17-2009, 01:09 PM

So it does! hahaha I didn't even notice it. Sorry :/

**mmq2009** · 01-17-2009, 01:13 PM

Originally Posted by IllustriousLyts

So it does! hahaha I didn't even notice it. Sorry :/

lol

any idea why

**Snookerman** · 01-17-2009, 01:13 PM

Ok, like I promised here is a temporary solution, find this:

Code:

<td bgcolor="#ffffff" height="30">
<table border="0" cellpadding="0" cellspacing="0" width="190">
  <tbody><tr>
	<td width="4">&nbsp;</td>
	<td background="index.php_files/stp2.png" width="6" height="29">&nbsp;</td>
	<td background="index.php_files/stp1.png" width="162"><span id="topbar">Popular Products</span></td>
	<td background="index.php_files/stp3.png" width="10">&nbsp;</td>
	<td width="8">&nbsp;</td>
  </tr>
</tbody></table>

and change it to this:

Code:

<td bgcolor="#ffffff" valign="top">
<table border="0" cellpadding="0" cellspacing="0" width="190">
  <tbody><tr>
	<td width="4">&nbsp;</td>
	<td background="index.php_files/stp2.png" width="6" height="29">&nbsp;</td>
	<td background="index.php_files/stp1.png" width="162"><span id="topbar">Popular Products</span></td>
	<td background="index.php_files/stp3.png" width="10">&nbsp;</td>
	<td width="8">&nbsp;</td>
  </tr>
</tbody></table>

Not very semantic but should do it for now.

Good luck!