CSS: background color

[chlori]

Hello

The white content div is as high as the content, of course.

I am trying to make the conent part white from the top
(under nav bar) where it is now down to where the
footer starts.

Here is the URL:
http://www.arto.ch/tests/thinklab/index2.php

Any ideas?

 

[Bernhard Sturm]

Hello

The white content div is as high as the content, of course.

I am trying to make the conent part white from the top (under nav bar)
where it is now down to where the footer starts.

Here is the URL:
http://www.arto.ch/tests/thinklab/index2.php

Any ideas?

that's a tricky one, because you don't know how much content you will
have in your right/left column. you are now in the murky depths of
liquid layouts. And to be honest: I don't know how to solve this either.
I will offer you a solution for a fixed width layout (the only one I
know to overcome your problem, maybe it's of any help to you).
There would be an easy solution if you had decided for a fixed width
layout (set a background gif with grey and white section with 1px height
and repeat it on the y-axis within your main div container... but then
you will need to re-organise your divs...
just refer to a list apart for the faux columns technique:

http://www.alistapart.com/articles/fauxcolumns/

cheers
bernhard

p.s. it's always good to think first about what technique is necessary
for a certain layout before actually starting with the implementation ;-)

 

[Richard]

Hello

The white content div is as high as the content, of course.

I am trying to make the conent part white from the top
(under nav bar) where it is now down to where the
footer starts.

Here is the URL:
http://www.arto.ch/tests/thinklab/index2.php

Any ideas?

Use a container for the 3 columns.
Put the container between the menu and footer.
Define a minimum height for the middle.
As more content is inserted, the footer is simply pushed down.
Do not define a height for the container.

 

[chlori]

Bernhard Sturm schrieb am 20.01.2005 18:13:

p.s. it's always good to think first about what technique is necessary
for a certain layout before actually starting with the implementation ;-)

I knew I would have this problem, but I thought it
would be easier to solve...

Now I tried it with two container <div>s, please look
at http://www.arto.ch/tests/thinklab/index3.php

It seems to work in IE6/FF1. How about other browsers?

The HTML isn't beautiful at all with all those <div>s,
but how bad is it? Why? What do you think of this
solution (if it really is one)?

There *must* be a nicer way....

 

[Bernhard Sturm]

Bernhard Sturm schrieb am 20.01.2005 18:13:

I knew I would have this problem, but I thought it would be easier to
solve...

liquid layouts are never easy to solve.

Now I tried it with two container <div>s, please look at
http://www.arto.ch/tests/thinklab/index3.php

nice solution! no objections from my part (concerning the two container

It seems to work in IE6/FF1. How about other browsers?

all thumbs up here: opera 7.5 okay, netscape 7.0 okay (windoze xp sp2)

The HTML isn't beautiful at all with all those <div>s, but how bad is
it? Why? What do you think of this solution (if it really is one)?

it looks valid and I would use it. if it seems to fit your needs, then
go for it. I have only one small objection which concerns the order of
the content <div>s.. from an accessibility point of view: you wouldn't
want to appear the main content container as the very last thing someone
with a screen reader would see or hear.. but that might be a minor
problem, as you could put an 'invisible' jump-to-content link at the top
of your page.

There *must* be a nicer way....

I am not so sure... It's a nice idea to position the background images
at the leftmost and rightmost edges of their respective divs, but you
can't avoid having two divs here.
what do others think about this?

bernhard

 

[Bernhard Sturm]

Use a container for the 3 columns.
Put the container between the menu and footer.
Define a minimum height for the middle.

this will not work in IE. IE ignores minimum heights...

As more content is inserted, the footer is simply pushed down.
Do not define a height for the container.

does not work if your right col or left col gets more content than your
middle container holds.

bernhard

 

[ghoul]

Use a container for the 3 columns.
Put the container between the menu and footer.
Define a minimum height for the middle.
As more content is inserted, the footer is simply pushed down.
Do not define a height for the container.

richard is a sicko

 

[Karl Core]

richard is a sicko

No shit, really?
Thanks for feeding the troll. Not like there's not enough of that going on
around here without your help.

 

[Richard]

this will not work in IE. IE ignores minimum heights...

I am not speaking of minimum-height attribute.
In the css you would define the height as height:300px;

does not work if your right col or left col gets more content than your
middle container holds.

Yes it will. The height attribute only gives the box an absolute starting
point.
If you define a box with no height, and no content, what happens?
The box is simply not shown.
As you add content, the box naturally expands.

bernhard