ansaurus

Question

Whats wrong with this table format in IE?

Answer 1

+2 A:

1000 + 250 + 25 > 1250

your middle table is too wide

xor_eq 2010-06-29 17:46:02

doesn't fix the problem though.

2010-06-29 17:47:30

adding a width="1000"to your second td (the one with the top-bg.gif-background) will help, this time I checked

xor_eq 2010-06-29 18:13:53

I remember something like IE ignores any width parameters if not all of the table-cells in the first row have it. might be wrong though, not sure.

xor_eq 2010-06-29 18:17:29

Answer 2

+3 A:

According to the W3C Validator, your XHTML contains six errors. More specifically, the width="250" attribute that gets ignored is not valid. The main problem with invalid tags is that you no longer get a coherent cross-browser rendering since browsers are forced to use workarounds. Try to fix this first. As a general rule, layouts should be accomplished via CSS.

Álvaro G. Vicario 2010-06-29 18:04:55

fixing all of these errors doesn't fix it either.

2010-06-29 18:11:40

Answer 3

+3 A:

You are taking an extremely archaic approach to web site layout. Using tables to lay out anything in a web site that is not tabular in nature is a MASSIVE no-no. You should be using standards-compliant CSS and HTML (DIVs, Spans, etc.) to lay your site out. Tables are treated differently by each browser, and it can be extremely difficult to get a consistent, functional, easy to maintain layout with them.

I hate to say it, but I really can't bring myself to help you resolve your current problem using tables. My only answer is restart, use DIV tags and CSS, and enjoy the bliss that is standards-compliant layout. (Do NOT use the style="" attribute to set all your CSS, use a proper stylesheet.)

jrista 2010-06-29 18:20:35

Answer 4

+1 A:

When all is said and done the short answer is...because IE can be very retarted. That said here is a work around:

First you issue simplified is this:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt; 
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> 
<head></head> 
<body> 
<table width="1000" border="1"> 
 <tr> 
  <td width="250" style="background-color:blue;">a1</td> 
  <td style="background-color:green;" >a</td> 
 </tr> 
 <tr> 
  <td colspan="2" style="background-color:red;"> 
       <table> 
        <tr> 
         <td width="1000">c2</td> 
        </tr> 
       </table> 
  </td> 
 </tr> 

</table> 
</body> 
</html>

Notice your 2nd td in your 1st row has no width specified. If you know what the width should be then you can work around this issue like so:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt; 
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> 
<head></head> 
<body> 
<table width="1000" border="1"> 
 <tr> 
  <td width="250" style="background-color:blue;">a1</td> 
  <td width="750" style="background-color:green;" >a</td> 
 </tr> 
 <tr> 
  <td colspan="2" style="background-color:red;"> 
       <table> 
        <tr> 
         <td width="1000">c2</td> 
        </tr> 
       </table> 
  </td> 
 </tr> 

</table> 
</body> 
</html>

I do agree with what others have said, that css is the way to go, but that was not your question. Hopefully this helps.

testing123 2010-06-29 18:26:36

ansaurus

tags:

views:

answers:

Whats wrong with this table format in IE?

related questions