css layout

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
malcolmboston
DevNet Resident
Posts: 1826
Joined: Tue Nov 18, 2003 1:09 pm
Location: Middlesbrough, UK

css layout

Post by malcolmboston »

i have 2 divs that looks like the following

Code: Select all

[----------------------] [-------------------------------------------------]
[                           ] [                                                              ]
[                           ] [                                                              ]
[                           ] [                                                              ]
[                           ] [                                                              ]
[                           ] [                                                              ]
[                           ] [                                                              ]
[                           ] [                                                              ]
[                           ] [                                                              ]
[                           ] [                                                              ]
[______________] [                                                             ]
                              [                                                              ]
                              [                                                              ]
                              [                                                              ]
                              [                                                              ]
                              [                                                              ]
                              [                                                              ]
                              [_______________________________]
i want them both to have the same height, im using the code something like

Code: Select all

<div style="float: left;">&nbsp;</div>
<div style="float: left;">&nbsp;</div>
how can i get them both to stretch to the same height as 99% of the time the right box is much longer than the left box

edit: the image looked right when editing in FF :S
User avatar
Oren
DevNet Resident
Posts: 1640
Joined: Fri Apr 07, 2006 5:13 am
Location: Israel

Post by Oren »

Do you really need them in the same height or just to look as they are the same height? (I hope you know what I mean)

If you just want them to look as they are the same height, put both of them in a container DIV and use the appropriate background image to make it look as they were the same height - this is a pretty common technique.
User avatar
Chris Corbyn
Breakbeat Nuttzer
Posts: 13098
Joined: Wed Mar 24, 2004 7:57 am
Location: Melbourne, Australia

Post by Chris Corbyn »

Search for "faux columns". People use background images to create an illusion.

http://www.alistapart.com/articles/fauxcolumns/
User avatar
JayBird
Admin
Posts: 4524
Joined: Wed Aug 13, 2003 7:02 am
Location: York, UK
Contact:

Post by JayBird »

Ill third that...faux columns is the way to go
Post Reply