[thelist] CSS layouts

[lon.kraemer]

Kevin,

> The idea is to have one big container (centrebox), which contains
> a left hand column (leftcol + sidebar(s)), and the main content in
> the right-hand column (rightcol).  The question of the day is how is
> it that the rightcol container somehow seems to be longer than the
> centrebox, which contains it?  Or -- same question phrased
differently --
> why is the vertical length of centrebox seemingly tied to that of the
> leftcol + sidebars?  I would have thought that the outermost container
> would be at least as tall as the tallest thing it contains?

Since .rightcol is positioned absolute, it is NOT contained within
.centrebox. Absolute removes the element from the "normal" flow.

> Actually, "people don't want 3/8 inch drills, they want 3/8 inch
HOLES."
> What I really want is this appearance, in the most lightweight code
> possible.  If I had sent this as a screenshot instead of setting up a
> test page, how would you attack the problem starting from scratch?
(In
> general terms, that is.)

[I've sent you a very concise version offlist]

> The yellow stripe on the right is the end of "backdrop.gif", the
1-pixel
> strip which I'm using to define the background color. Ideally your
> browser window would be just narrow enough that the right edge
wouldn't
> show.  :-)  In fact, another way of phrasing the original question is,
> "why doesn't the backdrop.gif color -- wide tan band, white page, and
a
> thin yellow line -- go all the way to the bottom of the page?"

You have the background-image in .centrebox, which declares width:95%.
The "grey" I mentioned yesterday is my browser background color that
fills the remaining 5%. The background image should be in the body rule.

If indeed "background.gif" is only 1px tall, I'd suggest making it at
least 25px. The file size will be only slightly bigger, but the
rendering time will improve significantly.

--
Lon Kraemer
-----------------------------------------