PDA

View Full Version : How do I make a CSS Layouts Height Stationary



StarrRider
05-12-2007, 05:41 AM
I have been playing with one of the DD CSS Layouts. Namely #3.1 - at http://www.dynamicdrive.com/style/layouts/item/css-liquid-layout-31-fixed-fluid-fixed/
All of which would be good - if I had stuff to put in the left & right columns. Actually - I do - three OnMouseOvers that I don't need to scroll out of sight.

Said in another way - I'm trying to emulate a Frame based page - where everything is stationary except the content which can be scrolled.
This is not CSS but should explain what I mean.
#header height=75px
#left, #content, & %right height=100%-(75+50)
#footer height=50px

I've tried a number of things - Divs / Spans and Tables and nothing seems to work for me. I added Tables to the left and right columns with a height=100% and a &nbsp; in each <td>. Doda! :confused: However - specifing an actual height=100px does work - so I tried adding some js.


function adjustHeight(id) {
if (document.getElementById){
var h=document.body.clientHeight-(75+50);
document.getElementById(id).style.height=h;
} else {
var h=window.innerHeight-(75+50);
eval(id).height=h;
} }

After the table is created:


</table>
<script type="text/javascript"><!--adjustHeight("tableID");--><script>

Doda again :confused: