Forum Moderators: mack

Message Too Old, No Replies

How to stretch a page to 100% height

dumb question ...

         

zyshen

4:35 pm on Aug 5, 2004 (gmt 0)

10+ Year Member



I have a question regarding the design of web pages. There are always pages that don't have enough content to cover the full page. So below the bottom menu, it shows a huge blank space sometimes cover up to 20% of the screen size. and this problem is worsened when using higher resolutions.

My page structure looks like the following :
<table> logo and nav menu </table>

<table> content </table>

<table> bottom menu and copyright </table>

--- blank space ---

My question is what is the best way to stretch the middle (content) table to cover as much space as possible, regardless of contents and resolution, thus eliminating the blank space at the bottom.

Thanks for any help.

txbakers

6:52 pm on Aug 5, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



<table>
<tr>
<td height="500">
<!-- your content here -->

<!-- end content -->
</td>
</tr>
</table>

is one way

zyshen

7:51 pm on Aug 5, 2004 (gmt 0)

10+ Year Member



but that will means it only works under 800x600 resolution. when someone switch to 1024x867 or bigger, it will still be a blank gap at the bottom. Plus, I can't use percentage since my top logo and bottom menu table are all in pixels.

thanks for you answer and any further suggestions!

egomaniac

9:00 pm on Aug 7, 2004 (gmt 0)

10+ Year Member



try setting the column width to a fixed size.

nothing will be perfect in all screen dimensions. the best you can do is try to optimize for 1 or 2 target sizes.

shinyblue

9:29 am on Aug 10, 2004 (gmt 0)

10+ Year Member



what exactly do you want that blank spaced to be filled with? You can't stretch out your content. You could fill it with a color block.

You can do this:
<table height="100%"><tr valign=top><td>

-- put your other tables here --

</td></tr>
</table>