CSS, 3 Col stretchy layouts

[Silkster]

Hi Everyone...
Ian not sure if this is possible but.. I have created a 3 col layout
with a stretchy center using pure CSS got it to work in everything..
sorted..

But the site Iam working on is aimed at multiple resolutions so it is
going to scale down to 800x600 and scale up to 1024x768...

the problem is HOW DO I STOP IT GOING PAST 1024?

Ideally I would like the container to stop at 1024 in the center of the
page with a repeating horizontal background going the full page?

I know I could use javascript get the resolution of the monitor and
display a correct template but in volves resizing the browser wind
which I do not like

Please somebody help

[Ben C]

On 2006-10-05, Silkster <da****@shopcreator.comwrote:

Hi Everyone...
Ian not sure if this is possible but.. I have created a 3 col layout
with a stretchy center using pure CSS got it to work in everything..
sorted..

But the site Iam working on is aimed at multiple resolutions so it is
going to scale down to 800x600 and scale up to 1024x768...

the problem is HOW DO I STOP IT GOING PAST 1024?

Ideally I would like the container to stop at 1024 in the center of the
page with a repeating horizontal background going the full page?

Sounds like you need to set the max-width property on the container. You
can set width to a percentage (I'm guessing this is what you mean by
"stretchy") and max-width to 1024px. Then you'll get the percentage, but
not if it means going bigger than 1024px.

The background-image can be on something behind the container, and you
can set the container to background: transparent.

If this makes no sense then perhaps I've not understood your problem, in
which case you could post a link to an example.

[Martin Eyles]

"Ben C" <sp******@spam.eggswrote in message
news:sl*********************@bowser.marioworld...

On 2006-10-05, Silkster <da****@shopcreator.comwrote:

>the problem is HOW DO I STOP IT GOING PAST 1024?

Ideally I would like the container to stop at 1024 in the center of the
page with a repeating horizontal background going the full page?

Sounds like you need to set the max-width property on the container. You
can set width to a percentage (I'm guessing this is what you mean by
"stretchy") and max-width to 1024px. Then you'll get the percentage, but
not if it means going bigger than 1024px.

You should bear in mind that this will not work in Antiquated browsers, such
as IE6 or below. In these the max-width will be ignored, and the centre
column will continue to get larger in larger windows. It should work in
modern browsers though (and I think that this may even include IE7).

Martin

[Andy Dingley]

Martin Eyles wrote:

You should bear in mind that this will not work in Antiquated browsers, such
as IE6 or below. In these the max-width will be ignored,

Although by taking a generous interpretation of "work", this isn't a
problem.

You might ideally constrain the maximum width by setting max-width on
the outermost suitable container <div>, but if IE chooses to ignore
that, then it's hardly a major failure.

[Martin Eyles]

"Andy Dingley" <di*****@codesmiths.comwrote in message
news:11*********************@c28g2000cwb.googlegro ups.com...

>
Martin Eyles wrote:

>You should bear in mind that this will not work in Antiquated browsers,
such
as IE6 or below. In these the max-width will be ignored,

Although by taking a generous interpretation of "work", this isn't a
problem.

You might ideally constrain the maximum width by setting max-width on
the outermost suitable container <div>, but if IE chooses to ignore
that, then it's hardly a major failure.

Agreed. It's still accesible in IE6 so it isn't a problem, and it is still
the elegant solution.