Menu
The following code doesn't render the top row correctly in Chrome (IE8 renders ok, I haven't tested in other browsers)
<head>
</head>
<body>
<table width="100%" border="1">
<tr>
<td width="15%">a</td>
<td width="70%">b</td>
<td width="15%">c
<table border=1>
<tr>
<td valign="top">Subtotal:</td>
<td valign="top">$2,464.34</td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="3">
<input type="text" style="width:500px;" />
</td>
</tr>
</table>
</body>
It seems the fixed width in the INPUT control is causing the problem. If I change 500px for 80%, it magically works properly. Or if I take out the inner table in column "c", it also works.
Why it appears the colspan=3 is being ignored? Any ideas?
352
Guess what! :) after dumb investigation (3 hours work) I found that for some reason display:table-cell is overwritten in chrome. so just ad table-cell display and all will be good :).
Edited answer --------- So after checking It seems that some of the reset stylesheets puts display: block on TDs. So if it does happen you can either remove that stylesheet, edited or overwrite it.
164
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
