PDA

View Full Version : Help with table sizing



edesignuk
Aug 27, 2005, 02:06 PM
Having some problems here chaps! I'm trying to get it so that my page "header" is always at the very top, and my "footer" at the very bottom.

What I have done works in IE, but nothing else :o, like so...

MSIE6
http://upload.yo-momma.net/uploads/forums/Picture 2.png

Firefox (and same goes for Safari)
http://upload.yo-momma.net/uploads/forums/Picture 3.png

This is the code for the table:<table width="800" height="100%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="110" background="images/header.jpg">&nbsp;</td>
</tr>
<tr>
<td height="30"><!-- Stuff removed --></td>
</tr>
<tr>
<td height="%" align="left" valign="top" class="tdcontent" >
<!-- End header -->
<!-- Start content -->

<div align="center">Welcome to <a href="http://thurrocktech.com">ThurrockTech.com.</a> This site is currently under contruction, getting ready to offer you the best IT services in Thurrock. Come back soon to see how we can help you to solve all your IT gremlins.<br/>
<br/><img src="images/progress.gif"></div>
<!-- End content -->
<!-- Start Footer -->
</td>
</tr>
<tr>
<td height="32" background="images/footer.jpg">&nbsp;</td>
</tr>
</table>As you can see, I have 1 table split in to 4 rows, 3 of which are fixed sizes, and the other I want to be dynamic to fill any extra space.

Row 1 - FIXED - 110px
Row 2 - FIXED - 30px
Row 3 - DYNAMIC (Well, supposed to be!!) - "%" also tried "100%", but didn't help.
Row 4 - FIXED - 32px
So basically, I'm hoping one of our resident gurus can tell me where I'm going wrong, and how I can get it to look as it does in the IE screenie across all browsers.

Many thanks!


dubbz
Aug 27, 2005, 02:26 PM
I tried that code in Firefox (1.0.6) and it displayed just like in your IE shot.

I don't have the same problem... :confused:

Edit: Tried it in Opera too. Looks just fine there too.
edesignuk
Aug 27, 2005, 03:11 PM
And if you go to the actual website (thurrocktech.com) how does it look?

Thanks.
Mitthrawnuruodo
Aug 27, 2005, 03:21 PM
From memory: There is no (valid) height attribute for table. If you want this you have to use div-tags with position fixed and height auto. :)

Edit: Like this (from the CSS2 specification) (http://www.w3.org/TR/REC-CSS2/visuren.html#absolute-positioning).
dubbz
Aug 27, 2005, 03:22 PM
Ah.. Now I get it :)

Use of "HEIGHT" isn't actually valid code. That's why it rendered fine for me (I didn't specify a doctype).

One solution whould be to change the rendering mode of the browsers by changing the doctype to:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

...although I'm not sure how it whould affect the rest of your code.

Alternatively, you could use CSS (which is the "proper" way).

Edit: Eh, Mitthrawnuruodo beat me to it :p
edesignuk
Aug 27, 2005, 03:26 PM
Brilliant! Thank you very much.

There's no way in hell I'm learning CSS properly for this little project, this work around will do me just fine :D