I'm struggling to apply css-styling to a GWT (Google Web Toolkit) generated html table in Safari. Specifically, I cannot get Safari to respect the height attribute of a table row after I trigger any kind of re-draw of the table.
The following basic example illustrates the problem:
<html>
<head>
<style type="text/css">
tr {
height: 50px;
font-weight: bold; /* added to prove that other style rules are re-applied when enabling css again */
}
</style>
</head>
<body>
<table border="1px">
<tr>
<td>one</td>
<td>two</td>
<td>three</td>
</tr>
</table>
</body>
</html>
If I open this page in Safari it renders correctly at first. If I then choose "disable styles" from the Develop menu and then immediately re-enable them again, the heigh rule is ignored and the height of the table row is calculated as if it were set to "auto".
This is exactly what happens when rows/cells are added or removed programatically in my GWT FlexTable.
Does anyone know what causes this behavior and if there is a workaround that does not require setting a fixed height on the entire table?
Details:
Running Safari Version 4.0.3 (5531.9) on Mac OSX Leopard
The problem also occurs using the GWT Hosted Mode browser (which essentially is Safari when running it on a mac)
Thanks, Joakim