[trobertson]

Hi Folks,

I need to place a div element on a page and would like to set its top position at a specific pixel location, and I would like its height to take up the remainder of the available screen size. So the element's height changes as the screen size changes, but its top position is a fixed pixel value ... What makes this difficult (I think) is that I am trying to mix pixel and percentage values.

Can anyone suggest a solution? Does this require bunch of JS?

Thanks!

[rangana]

The fixed height on top could just be done using CSS (position:fixed). While the height dilemma needs JS:

1.) Know your container's height if you're placing your divs inside a wrapper. Or know the body's height in which you want to base the remaining height and use offsetHeight to know your container/body's height

2.) Do basic algebra (subtraction)

See if it helps

[trobertson]

I can set the top no problem. As you point out, the height is the dilemna. So, would you call a javascript function when the page loads to get the available screen size and change the css rule dynamically? If so, would this continue to work if the user changed the screen size by dragging the corner of the browser?

Thanks !!!

[rangana]

I'm not certain...as I never had tried it, yet i've seen its effect taking in action here:
http://bonrouge.com/~fixH

[trobertson]

OK, I get it ... Thanks rangana !!!

[rangana]

No problem, just get back if you're still stumped