HTML DOCTYPE can be your friend - or your enemy…
February 3rd, 2008
When you just need to get the job done, sometimes it pays to visit the wayback machine. Recent DOCTYPEs can wreak havoc on even simple layouts when relying on deprecated functionality.
For instance, even HTML 4.01 Transitional:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
doesn’t support the good old table HEIGHT property - you will get mixed results when setting absolute heights on TABLEs or TDs. However, rolling back to HTML 3.2 Final:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
will magically restore this functionality. Go ahead, make a 3 row table that fills 100% of the window, with the middle row set to a fixed height and the outer rows filling the remaining height:
<table style="height: 100%" border="1"><tbody>
<tr>
<td>Row 1 fills top half of table</td>
</tr>
<tr style="height: 100px">
<td>Row 2 is exactly 100 pixels high</td>
</tr>
<tr>
<td>Row 3 fills bottom half of table</td>
</tr>
</tbody></table>
This will work under Firefox using both HTML 4.01 and 3.2, but only 3.2 will produce the desired effect in Internet Explorer.
Sad that it’s still so difficult to achieve some seemingly basic results with the latest standards. Further reading at W3C and HTMLHelp.
Leave a Reply