Modifying DIV height

Associate
Joined
5 May 2007
Posts
1,470
Hello all.
I'm trying to recreate a website I did, this time using divs instead of tables.
http://www.brokenrubix.co.uk/stephdiv.html < How can i extend the menu div to the same length of the main content without physically setting the height to the nearest pixel? Is there a way it will automatically change when the content does?
Thanks
 
Google 'faux columns'.

If you're wanting it to look like this, I don't mind doing it up quickly for you. Would only take 10 minutes. Then you could study it to see how I did it.
 
Damn, the only real way to do it is to use a background of some sort? I'd have thought there'd have been a MUCH simpler way. Can you explain how i'd do it?
 
Well, tbh, what you have there is kind of a mess at the moment.

If you want it to look exactly like your old version, you could nest the menu div and the content div inside a container. The px amounts I've given are just for example. Just float the content div to the right.

----container (800px wide)-----
--menu (200px wide) -- ---content (600px wide) ---

Then give the container the grey background color. Then give the content div a 2px black left border. As long as the content is always longer than the menu, it'll appear that the menu div extends just as far as the content does. (if you use this method, remember to subtract the border width from the content container otherwise it'll be too long)

Personally, I'd just make a 1px high background and apply it to the container.
The background would be like the one below.. but you can crop it to 1px high to save bandwidth and shave a fraction of a milisecond off load time.

steph-bgExample.jpg
 
Back
Top Bottom