HTML - Problem With Tables.

I made a layout in dreamweaver but im getting problems, my navigation is stretching when i add too much content to the content table, it shows fine in chrome but in firefox and IE i get this


Any ideas whats causing this?

I have a table with 5 columns and it does not render correctly in IE on a 1024 x 768. The problem goes away by increasing two column widths from 5% to 8%.

I have not tested the pages on platforms with a lower resolution.

I prefer to use the version with the narrower columns. Please help me achieve the preferred layout, and explain what it is that I am doing incorrectly.

Related data:
Windows XP is used for all examples. With Firefox, Opera and Safari both widths are OK on 1024 x 768 and 1440 x 900 monitors.

http://www.iaps.com/eval/courses18-5-54-5-18.html
Column % widths are 18-5-54-5-18:

1024 x 768
IE6: Problem (both 5% columns do not appear)
IE7: Problem (both 5% columns do not appear)

1440 x 900
IE6: No problem
IE7: No problem

http://www.iaps.com/eval/courses15-8-54-8-15.html
Column % widths are 15-8-54-8-15:

1024 x 768
IE6: No problem
IE7: No problem

1440 x 900
IE6: No problem

While the page may not be very attractive, it has to render properly.

Thanks in advance,

Don

Hi, I have made a table, with three columns, three rows. I want each of the outside columns, to stay the same size throughout, but want to be able to put images in them, but when i do, the size of the cell grows, almost double, as though, making EXTRA room for the picture. what do i do to force the cell size to stay the same, when a picture is put in.

Thanks
Alex

I have had many issues with tables but in the end they were worth it. I have 1 last problem. My website in regular view on a small screen looks great but when I maximize it on a bigger screen, the scroll bar disapears on the page because the whole page fits on the screen so its not necessary, but when it disapears, the table does not stretch to the end of the page, instead it stops where the scroll bar was and the page background takes over and gores until the end. The width of the table is set to 100 percent and it has no problem auto adjusting to any screen size except when the scroll bar disapears. How do i make this thing stretch further when there is no scroll bar?

Please refer to attached screenshot below. If I wanted to change one of the colored row to another color say blue, how could I do this please? See my XHTML and CSS below:

Quote:
th {
background-color: #cc6600
}

.cellcolor {
background-color: #fcba7a;
}
<table summary="This table holds data about the cities I visited on my travels. I've included the date I was in each city, the temperature when I was there, and altitude and population
of each city. I've also included a rating of the diners where I had lunch, on a scale of 1 to 5.">
<caption>The cities I visited on my Segway'n USA travels</caption>
<tr>
<th>City</th>
<th>Date</th>
<th>Temperature</th>
<th>Altitude</th>
<th>Population</th>
<th>Diner Rating</th>
</tr>
<tr>
<td>Walla Walla, WA</td>
<td class="center">June 15th</td>
<td class="center">75</td>
<td class="right">1,204 ft</td>
<td class="right">29,686</td>
<td class="center">4/5</td>
</tr>
<tr class="cellcolor">
<td>Magic City, ID</td>
<td class="center">June 25th</td>
<td class="center">74</td>
<td class="right">5,312 ft</td>
<td class="right">50</td>
<td class="center">3/5</td>
</tr>
<tr>
<td>Bountiful, UT</td>
<td class="center">July 10th</td>
<td class="center">91</td>
<td class="right">4,226 ft</td>
<td class="right">41,173</td>
<td class="center">4/5</td>
</tr>
<tr class="cellcolor">
<td>Last Chance, CO</td>
<td class="center">July 23rd</td>
<td class="center">102</td>
<td class="right">4,780 ft</td>
<td class="right">265</td>
<td class="center">3/5</td>
</tr>
<tr>
<td>Truth or Consequences, NM</td>
<td class="center">August 9th</td>
<td class="center">93</td>
<td class="right">4,242 ft</td>
<td class="right">7,289</td>
<td class="center">5/5</td>
</tr>
<tr class="cellcolor">
<td>Why, AZ</td>
<td class="center">August 18th</td>
<td class="center">104</td>
<td class="right">860 ft</td>
<td class="right">480</td>
<td class="center">3/5</td>
</tr>
</table>