Sent by Seth Green on 24 January 2007 13:01
I'm sorry, my "what it should look like" page got screwed up. The blue
div should be fully contained within the outer green container.
I appreciate you response, but you used fixed heights to achieve this,
and the whole point of my question was that I can't use fixed heights.
I suppose this is further evidence that this type of layout can not be
achieved with CSS alone.
Thanks,
Seth
Gunlaug Sørtun wrote:
> Seth Green wrote:
>> Here is the test page http://normalish.com/test_page.html. This page
>> links to another page that shows what the page would look like if I
>> were to accomplish my goals. You should ignore the css on the 2nd page
>> since it breaks the rules I set below. It is onlt there as a visual
>> representation of my end goal.
>
> I don't think this is how you want it, but if I am to achieve the visual
> you're after, it will end up something like this...
> <http://www.gunlaug.no/tos/alien/test_07_2000.html>
> ...where the apparent overflow at the bottom of the green-bordered div
> is added by me, just to make it look even more like the example you
> linked to.
>
> As you have no real control of container-width, amount of text,
> font-size and font-family, I have to add 'overflow control' on two
> fixed-height containers, inside another fixed-height container. The
> result doesn't look good IMO, but it's as close as you can get with CSS
> alone.
>
> I think it might be closer to what you want _if_ the overflowing part of
> 'nonScrollDiv' could "spill over" to 'scrollDiv', so only the latter
> were to scroll - regardless of whatever variables that affected your
> construction. You could possibly achieve that with some clever
> Javascript, but that's beyond me and this list.
>
>
> The normal way of handling cases like this with CSS, is to put all text
> (and whatever else we got) inside one fixed-height container, and add
> 'overflow: auto' to that container. Then the spill-over is automatically
> taken care of, and you get a scrollbar when you need one.
> Apparently that's not what you want, but here's a basic example anyway...
> <http://www.gunlaug.no/tos/alien/test_07_2002.html>
>
> regards
> Georg
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
