Question

I have a problem with the site I maintain where everything renders fine in Firefox and IE, but not in Chrome. The problem is that the page overlaps over the left sidebar area in Chrome. The pages structure is to use tables for everything (this can’t be changed). So I have something that is basically like this:

<table>
<tr>
<td width="200">There is an iframe here that shows up normal</td>
<td width="40">This is a spacer image</td>
<td width="500">This is where the site's main content goes</td> 
</tr>

The problem is that everything is getting pushed over to the left and after messing around with Chrome’s “Inspect Element” feature, that it is because the first <td> tag is being rendered at 90 pixels no matter what I make the width. I’ve played around with display: block, display: inline-block, etc. and tried to mess with the stylesheets, but nothing is getting it to change in Chrome.

Any help or advice would be appreciated.

Answer 1

So changing the padding works to adjust the table cells and I just added a little script to check if the browser is chrome and use a separate stylesheet to adjust for this. I’m still clueless though why Chrome renders things differently.