[thelist] CSS layouts

[Kevin Martin]

"lon.kraemer" <lwkraemer at directvinternet.com> wrote:
> Kevin,
>
> > I now have a "centrebox, leftcol, and rightcol"
> > arrangement, plus an alternate "sidebar" class where I can add
> > marginal comments to the area on the left.
> >
> > http://brasscannon.net/test.html
>
> I see only two columns and three patches of vertical color (tan, white,
> grey). Frankly, I can't make sense of your CSS. When this happens, I
> automatically run the page through a HTML validator since many CSS
> problems are virtually impossible to debug on a page where the HTML does
> not validate. Unfortunately, this page is a validation nightmare.
>
> Perhaps if you got the page to the point where the HTML validates, we
> might be able to assist with your CSS questions.

Strict, but a fair cop.  That was mostly due to the Trend Micro
javascript mess at the bottom -- I've cut all that out and moved it
to another page, and fixed the remaining legitimate grumbles from the
w3c online validator.  By "legitimate" I mean there are a couple of
items I don't agree with (since when does a </HEAD> tag *require*
options?!), but the w3c CSS validator says I win a cookie and even
offered me a button to display.  Can I persuade you to try again? :-)

The CSS is blatantly stolen from the posting earlier in the thread.

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?

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.)

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?"

Again, thanks in advance.

--
Kevin "digger" Martin - evolt at brasscannon.net