CSS element sizing based on browser window, not content size

Ok, after strenuously working to eliminate tables I have discovered this seeming Achilles Heel of CSS: sizing of elements is based on the browser window size, not the size of the content inside the elements. For instance, telling a div to have width: 100% makes it 100% of the available space in the window, NOT 100% of the width necessary to contain the content inside that div. This causes problems when you have log text (like URLs) or more important, when you have a nested forum layout where 100s of replies can exist toward the right and yet the div element won't expand to contain them, making them break out of the element and screw up the whole layout.

Tables, for all their trouble, adhered to the width of the content in the cells, expanding to be as large as necessary to contain the content. There must be a way to work around this in CSS? Surely they didn't develop this complex layout standard and make it impossible to have layout function in this way?

Yeah, CSS divs work differently from tables. I just made a few examples of div sizing which may suggest solutions for some of your problems. If you look at these, use different browser sizes.

If you think sizing is a problem, wait 'til a float bites you in the butt

cheers,

gary

Well I tried employing a div overflow as your examples suggested. The problem is that it really slows down the rendering of the page (in Moz) and also when you scroll down a couple pages, it eventually screws up the rendering and some of the contents of the div get "streaked" and the display gets all messed up seriously.

It's just so funny how everyone talks about "hacked table layouts" but yet CSS is almost just as deficient and has just as many problems and requires just as many "hacks" to get it to work.

Perhaps your approach needs to be backed off from and looked at from a different angle.

If you have multiple page lengths to scroll through, maybe the method is not appropriate. Can you post a URL that we can look at?

cheers,

gary

Sure, check out this page. Notice that some wide content goes beyond the center element to the right. I did some tweaking to reduce the magnitude of the indents for each reply so there is less of a problem but inevitably, a deeply-replied-to thread will result in messages that break outside the center column, also on smaller resolutions this will be more of a problem.