Vertical-align div within div

[jc_gmk]

Does anyone know how to vertically align a div within another div?
without setting the height of the parent div!

I have two child divs that have variable heights (dynamically generated), they are in a parent div that has a variable height depending on the size of either one of the child divs (the child divs are side by side, so one could be bigger than the other)

e.g.

if 'child div 1' is 800px in height and 'child div 2' is only 100px high
i would like 'child div 2' vertically aligned in the middle.
'child div 1' would would stretch the parent div to 800px so wouldn't need to be vertically-aligned.

Hope this makes sense!

[boogyman]

forcing the shorter of the divs to center vertically is only going to confuse the user, not to mention it's breaking convention, which usually isnt a bright idea if doing it just for "shits n giggles" so to speak, which is what it looks likeyou want to do here.
you can use margins to push down the div that isnt as long.

the height of any unstyled element is the sum of the heights of its contents (which may have its own margin/padding by default)

[jc_gmk]

The 800px and 100px is only an example and an extreme one at that.
In reality there is probably only going to be about 150px difference either way.

I am doing it for a practical reason, I want my webpage to be uniform for which ever product someone clicks on.

The product picture is at the left hand side and the product desription is on the right and trust me, it looks a whole lot better when its vertically aligned.

I could do it using tables but i'm trying to avoid them.

[jc_gmk]

Anyone else have any idea how i can vertically align these divs without setting the height of any of them?

mayby some javascript to detect the height that the div has been stretched to?

[jscheuer1]

Sounds like a table to me.

[jc_gmk]

Yes, i've now given in to the table!

Thanks anyways! :)