...

View Full Version : 3 divs semi fluid



aaronl
07-14-2008, 07:55 AM
So here we go:

I have 3 divs. center, mid, and bottom. center will be the only one with height info passed to it, but needs to stay centered vertically between the other 2....

if the height was never to change, I could just say height is 33% for all 3, but it will change.. anyideas?

abduraooft
07-14-2008, 08:56 AM
Not sure about your requirement. It'd be more clear if you post your current code and explain on the basis of that.

aaronl
07-14-2008, 10:14 AM
well I don't really have any code, except 3 divs and classes assigned to them...


just think of it like a 3 column fluid layout... but horizontal instead of vertical. top and bottom need to scale but the center one will be a fixed height (which will be hardcoded in via php)



<div class="top"></div>
<div class="center" style="height: <?php $height; ?>">content</div>
<div class="bottom"></div>


im just not sure how to make the other two fill the rest of the page based on the center height

abduraooft
07-14-2008, 10:19 AM
How about the following?

#left{
float:left;
width:33&#37;;
}
#right{
float:right;
width:33%;
}
#middle{
margin:0 33%;
}

<div id="container">
<div id="left">A </div>
<div id="left">C </div>
<div id="middle">A </div>
</div>

aaronl
07-14-2008, 11:04 AM
except that thats 3 columns... not 3 rows. and what if the middle content height takes up more than 33&#37; of the page?

abduraooft
07-14-2008, 11:09 AM
except that thats 3 columns... not 3 rows. what? The above code is supposed to display 3 columns.

and what if the middle content height takes up more than 33&#37; of the page? You could set the required width by the
style="height: <?php $height; ?>", but if it's in % or em, then the dimension will depend upon the height of #container div



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum