• 0

Inconsistency in TD width with IE8


Question

AbeyMarquez

I am having a bit of a hard time with IE8 and its interpretation of column widths set via inline CSS.

I have replicated this issue in this 4-column table. One of the rows has a colspan="3" cell. It seems that depending on how much content there is in this cell, the widths of the other columns will change to whatever IE8 wants completely ignoring the width I specified. This does not happen on Firefox or Chrome (latest versions as of today) although I have not tried it with Opera.

Here's the code. Please play around with the length of the cell with the colspan and try it out on different browsers and you'll see what I mean. IE8 is the only one that changes the columns' widths.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<table width="100%" border="1" cellpadding="0" cellspacing="0">
	<tr>
		<td> </td>
		<td style="width: 250px"> </td>
		<td style="width: 150px"> </td>
		<td style="width: 150px"> </td>
	</tr>
	<tr>
		<td colspan="3">Welcome back to the Homing Beacon, the official Star Wars email Newsletter Fans of the show LOST got an earful of Star Wars references last Wednesday, courtesy of the character Hurley, whose trek back in time to 1977 has inspired him to write The Empire Strikes Back for George Lucas. The episode, called "Some Like it Hoth", included at least two exchanges between characters on the subject of Empire.</td>
		<td><input name="" type="text" /></td>
	</tr>
	<tr>
		<td class="subitem">A. No universitarios: Categor?a (N)</td>
		<td><input name="" type="text" /> x $2,500</td>
		<td><input name="" type="text" /></td>
		<td> </td>
	</tr>
</table>
</body>
</html>

Let me know what you think this might be. It could be a mistake on my part... who knows.

-Abey

Link to post
Share on other sites

1 answer to this question

Recommended Posts

  • 0
AbeyMarquez

Nevermind... found it. It's a very obscure but known IE bug which I guess hasn't been fixed in IE8... still... *sigh*

Adding style="table-layout: fixed" to the table tag fixed the problem. Apparently IE's inherited way of rendering tables is just another one of their weird and horribly incorrect interpretations.

-Abey

Link to post
Share on other sites
This topic is now closed to further replies.
  • Recently Browsing   0 members

    No registered users viewing this page.