Layout: css layout query

started by Mpj on Sep 15, 2004 — RSS Feed

Mpj Mpj
Posts: 76

Hi

I'm trying to produce a 2 column css layout for a site but I need some help.

The goal is to create a fixed width left column and a fluid right hand column that expands to the right edge of the screen. I've looked around and can't find any examples of this specific type of 2 column layout or even any explanations.

Does anyone have any ideas? Is this combination of fixed and fluid possible even?

Cheers

Joe Gillespie Joe Gillespie
Posts: 528

Do you really want a right hand column that expands infinitely to the right hand edge of the screen. On a large monitor, that is going to give ridiculously long text line lengths.

Look here...

http://www.wpdfd.com/editorial/basics/index.html

you will see a fixed left column and fluid right but I have set limits on how wide it can go like this...

max-width: 500px;
min-width: 350px;

Look at the style sheet

http://www.wpdfd.com/editorial/basics/basicsstyles.css

Mpj Mpj
Posts: 76

Hi Joe

I simplified question in my first post for the sake of clarity. In fact I've also found that I was asking slightly the wrong question...

I realised that the fluid right hand column issue was fine. The real problem was how to subsequently divide the right hand column into horizontal coloured blocks using divs. The div lenghts to be defined by the screen width and not by their content.

I may have found the solution ...

Joe Gillespie Joe Gillespie
Posts: 528

If you put a div inside another div and don't specify any width, it will become as wide as it can within the containing div.

Mpj Mpj
Posts: 76

Excellent! Thanks! I've found another solution but yours is much more elegant!

Mpj Mpj
Posts: 76

OK,

So I've finally used a solution that is part mine and part yours Joe.

I have been trying to use a "max-width" setting but IE6 (Win) and IE5 (Mac) appear to ignore it ... Safari is fine with "max-width" but ignores "min-height", Mozilla (Win) reads both.

Any ideas? Is this a(nother) known problem with IE?

Thanks

Joe Gillespie Joe Gillespie
Posts: 528

Yes. IE can't handle min and max-width - yet!

You must login to reply