[thelist] Floaty CSS

Thu Nov 15 12:30:27 CST 2007

Dan,

Not sure if this has been answered yet, I get the list digest...

I have used this JavaScript, I found somewhere,...
to keep 2 divs equal heights. I have also called this function multiple
times in one document.

**   <script>
**   function setheight() {
**  
document.getElementById('left').style.height=document.getElementById('right').offsetHeight
**   +  "px";

**   }
**   </script>

...

**   <body onload="setheight();">

Whatever your div id's are set to that is where ('left') and ('right')
would be....

hth,

megan

---------------------------------

Message: 22
Date: Thu, 15 Nov 2007 17:02:42 -0000
From: "Dan Parry" <dan at virtuawebtech.co.uk>
Subject: [thelist] Floaty CSS
To: <thelist at lists.evolt.org>
Message-ID: <061601c827a9$567bf660$0373e320$@co.uk>
Content-Type: text/plain;        charset="windows-1250"

Hi all

I'm having an issue with CSS that's probably really easy and elementary to
fix, but CSS isn't friendly to me... I have a holder (div) that contains 2
floated divs as per this diagram:

+--------------------------------+
|+-------+ +--------------------+|
||       | |                    ||
||   1   | |          2         ||
||       | |                    ||
|+-------+ +--------------------+|
+--------------------------------+

Now, how do I make sure that the divs (1 and 2) are always the same height?
They contain dynamic data and have their own background colours... If 2 is
larger than 1 then 1 finishes early (can't find a better way of saying that)
allowing 2 to expand vertically, eventually wrapping underneath 1...
diagram:

+--------------------------------+
|+-------+ +--------------------+|
||       | |                    ||
||   1   | |          2         ||
||       | |                    ||
|+-------+ |                    ||
|+---------+                    ||
||                              ||
|+------------------------------+|
+--------------------------------+

So how do I get the height of 1 to mirror that of 2? Conversely, 1 may be
longer than 2 so also needs the same constraints

I hope that makes sense

TIA!

Dan

-- 
Dan Parry