Hi. I am having problems setting table heights in IE with an XHTML Strict doctype. Basically, all i want is to have a table set to 100% height. I can easily do this if i set the HTML and BODY tags to 100% height as well, but if i change the body margin to anything other than 0px, i get vertical scroll bars. Here is a sample code to show my problem. (i have used inline styles to make it easy to read)
This works fine
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" style="height:100%">
<head>
</head>
<body style="height:100%; margin:0px">
<table border="0" cellpadding="3" cellspacing="0" width="50%" align="center" style="height:100%; background-color:#EDEDED">
<tr>
<td>test</td>
</tr>
</table>
</body>
</html>
This shows vertical scroll bars
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" style="height:100%">
<head>
</head>
<body style="height:100%; margin:20px">
<table border="0" cellpadding="3" cellspacing="0" width="50%" align="center" style="height:100%; background-color:#EDEDED">
<tr>
<td>test</td>
</tr>
</table>
</body>
</html>
This problem does not occur in Netscape, Firefox or Opera. Is anyone able to provide an explanation and a solution?It happens in FF and IE for me. I just upgraded FF to 1.0.5 so I don't know if that's the difference or not.
This works fine
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" style="height:100%">
<head>
</head>
<body style="height:100%; margin:0px">
<table border="0" cellpadding="3" cellspacing="0" width="50%" align="center" style="height:100%; background-color:#EDEDED">
<tr>
<td>test</td>
</tr>
</table>
</body>
</html>
This shows vertical scroll bars
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" style="height:100%">
<head>
</head>
<body style="height:100%; margin:20px">
<table border="0" cellpadding="3" cellspacing="0" width="50%" align="center" style="height:100%; background-color:#EDEDED">
<tr>
<td>test</td>
</tr>
</table>
</body>
</html>
This problem does not occur in Netscape, Firefox or Opera. Is anyone able to provide an explanation and a solution?It happens in FF and IE for me. I just upgraded FF to 1.0.5 so I don't know if that's the difference or not.