I think the "best" way, but only when possible, is to adjust your borders / background colour (if appropriate) so that the columns only 'appear' to be the same height.

Otherwise you are left with the option of javascript, css trickery or going back to tables (Which I think are sometimes unnecessarily avoided).

Googling for equal height columns divs will bring up loads of results.

Mark Rogers wrote:
Help!

Given the following:
    <STYLE>
    .box {
        border: solid 1px blue;
        float:left;
    }
    </STYLE>

    <DIV class=box>blah<br>blah<br>blah</DIV>
    <DIV class=box>blah</DIV>

This will render as two boxes, the left hand one with three lines of
content, the right hand one with just a single line.

How do I force (using CSS) the second box to have the same height as the
first box so that the borders line up?

(This is obviously just a trivial example of what I am trying to do.
With tables this would be easy, of-course.)

Note that the content in each box is auto-generated; no assumption can
be made about the size of the content in either box (or which box will
be "biggest"). I can't just set the height to a fixed value, for example.



_______________________________________________
Peterboro mailing list
[email protected]
https://mailman.lug.org.uk/mailman/listinfo/peterboro

Reply via email to