Measuring column height and dynamically adding content

Hi all,

I’ve got the following dilemma.

I have a 3 column CSS layout design. The page length is dynamic depending on how much content gets fed into each respective column. For this reason one column might be considerably longer than the other two, as a result the page length opens us white space in some columns.

Given the white space that appears if some content in columns is longer than in others, how could I measure the white space and depending on its height dynamically add in further content providing it fits (say additional side banners)?

I’m told this is possible in JS? I guess PHP is also a viable option?

Thanks a lot,

You could use strlen function in php.

I’ve studied the examples shown for strlen() at the source below but can’t see how I would pass the DIV of the column as a parameter?

What also strikes me is that the longest column contains more than just text in <p> <h1>, <h2>'s, for example both a vertical and horizontal accordion which dynamically grows/shrinks - determining its height purely by counting chars won’t work.

Maybe there’s a way to measure the container height which holds all columns? It’s height will always be whatever the tallest column is plus whatever padding/margin it has in there. Right or wrong? On the other hand even if this is workable then it won’t reveal how much whitespace is available in the column where the banners get displayed, given this it won’t be possible to determine if there’s enough whitespace to dynamically squeeze in another banner.

Anyone have any ideas?

Thanks in advance.

Everyone as equally confused on this one as me?

Haven’t you come across this problem when working for your clients?