How to get a DIV to adjust its length to its content?

Hey, dustPuppy...

For the first part of the question - sizing to fit the content like a table cell does, you might find some limited success with setting the <div> width to "auto" such as:

<div style="width: auto;">My content here.</div>

But there are times where the best tool for the job is the table. I used to be in the habit of doing table driven layout for my sites but now do all CSS. I still find that a good ol' table is exactly what I need - especially when dealing with creating nice layout for forms on a page. There are some CSS solutions I've seen out there, but they're a bit kludgy.

Now, the second part of your question. I have not found a way for the <div> to programmatically affect the width of a <td> containing the <div>. If the <div> width is set to 100%, it should push out the width of the <td> up to the contraints of any width setting on the <td>. So, if your <div> is set to 100% but your <td> is set to 50%, the <td>'s setting will become the "hard" boundary. If the <td> has a width set to 100% or auto, it should size to its contents, in this case the 100% declaration of the <div> inside of it.

Let me know if this helps...

Ric

Thanks Ric.
You're using width as an example, I was actually interested in the height. should it work the same way?

ewwww....height. That's a moving target, I'm afraid. I have not found a solution that will work cross-browser for setting height, especially when desiring a 100% fill of an area. IE will most of the time allow a <td> to be set to height: 100% and it will fill the parent <div> as expected, but Firefox won't behave the same...it will only size the <td> to be 100% of its contents, not the container. Safari...well, it's Safari, it does whatever it feels like doing, and often with unpredictable results.

There have been some solutions that will take into account the visible height of the browser "viewport" and try to adjust the <div> and <td> based on a pixel specification instead of a percentage. Check out www.quirksmode.org for more information on how/why you may want to set the height in this manner.

This is one of those REALLY big "your mileage may vary" topics...

Good luck!

hehe, thanks Ric, I was afraid that it was a complicated thing to achieve.
I'll look into the link you provided and post something here if I find something usefull.
Anyway, you get the points for helping me in the right direction.

this worked for me but as the content grows you'll have to manually change the height to fit.
<td class="leftmenu" style="background-color: #41a317" height="800px">