Determining the height of the browser window

N

Nathan Sokalski

The layout for my site is two primary areas: a title bar and a content area.
The title bar is a Panel with a fixed height. The content area is a Panel
that does not have a fixed height. I would like the content area to take up
the entire remaining height of the browser. This brings up two scenarios:

1. The content does not require the entire remaining height, which would
require setting the height to <browserheight>-<titlebarheight>

2. The content does require the entire remaining height or more, in which we
do not need to set the height at all

The first problem is determining what height is required by the content
area, since this can vary by browser. The second problem is determing the
browser height. Can anybody help me here? I have heard about the CSS
min-height property, but it is not yet supported by most browsers, so it
does not help me here. Thanks.
 
A

Anthony Jones

Nathan Sokalski said:
The layout for my site is two primary areas: a title bar and a content area.
The title bar is a Panel with a fixed height. The content area is a Panel
that does not have a fixed height. I would like the content area to take up
the entire remaining height of the browser. This brings up two scenarios:

1. The content does not require the entire remaining height, which would
require setting the height to <browserheight>-<titlebarheight>

Thats a little confusing. Why would you want to do that is the content
doesn't need it?
2. The content does require the entire remaining height or more, in which we
do not need to set the height at all

I'm not sure why you need to set a height at all?
The first problem is determining what height is required by the content
area, since this can vary by browser. The second problem is determing the
browser height. Can anybody help me here? I have heard about the CSS
min-height property, but it is not yet supported by most browsers, so it
does not help me here. Thanks.

True for cross broswer (esp for IE6 support you can't use min-height).

What DTD are you using?
 
N

Nathan Sokalski

Perhaps everything will be clearer if you look at my current site
(http://www.nathansokalski.com/). If you look at the navigation on the left
side of the screen, you will notice that the gray background does not extend
to the bottom of the browser window. I feel this makes the page look
somewhat ugly. For example, compare the following two pages:

http://www.nathansokalski.com/index.aspx

http://www.nathansokalski.com/poetry/viewpoem.aspx?poem=The+Night+Before+Finals

The content on the first page does not extend to the bottom of the browser
window, making the navigation background look like nothing more than a gray
rectangle. The content on the second page, on the other hand, does extend to
the bottom of the browser window, making the navigation background look more
like an area that is dedicated to the navigation. This is why I need to
dynamically set the height. I am using the following DTD:

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

Hopefully this makes my goals a little clearer. Thanks.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,997
Messages
2,570,240
Members
46,829
Latest member
KimberAlli

Latest Threads

Top