views:

2479

answers:

5
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Untitled Page</title>
    <link href="Stylesheet.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <table style="height: 100%; width: 100%;">
        <tr>
            <td colspan="2" style="height: 100px;">Header</td>
        </tr>
        <tr>
            <td style="width: 180px;">Links</td>
            <td>Content</td>
        </tr>
        <tr>
            <td colspan="2" style="height: 25px;">Footer</td>
        </tr>
    </table>
</body>
</html>

Stylesheet.css looks as follows:

*
{
    margin: 0;
    padding: 0; 
}
html, body
{
    height: 100%;
    width: 100%;
}

Row 1 and 3 above have fixed heights. Row 3 is not filling the remaining space. If i omit the doctype, it works as expected. I need to use this doctype.

Please help!

Thanks!

+1  A: 

Please clarify the browser you are trying to fix this in.

You should be using <div>'s anyway if you want to do things properly ;)

adam
And whenever possible, he should be using more appropriate semantic elements instead of <div>s.
porneL
A: 

I'm no web dev, but isn't height just applicable to block objects? Hence try setting the TR's height, and not the TD's.

leppie
+1  A: 

That's a quirk of Almost Standards Mode triggered by Transitional DOCTYPE. Use Strict DOCTYPE instead.

https://developer.mozilla.org/en/Gecko's_%22Almost_Standards%22_Mode
porneL
A: 

In general it is better to use strict instead of transitional but much more important is the use of div tags for layout and not tables.

THIS is the main discussion about tables vs. divs for layout but if you enter 'tables vs divs' as a search term you'll get more info about that.

tharkun
A: 

You are going to yell if you had the same problem I had. Try putting px after each declaration. It did not work in either browser for me without that pixel designation. I am finding this problem all over and a real headache.

pworthing