Fliud Layout problem

Problems with floats

[Red_Eye]

I am using a 2 column fuild design with the content column being on the left and the right column being fixed width.

In the content column I now want to place a fixed Left Column with a fluid right column.

e.g.

<div id="ContentLeft">
<div id="leftfixed">
content
</div
<div id="rightfluid">
content should fill the available width Textbox set to 100% width pushes this div to fill available space
</div>
</div>
<div id="rightcontent"
right content
</div>

the main content columns ids ContentLeft and Right are working as I intend.

div#leftfixed
{
float:left;
}

div#rightfluid
{
float:left;
width:auto;
/*width:100% doesn't work*/
}

not sure what I am doing wrong

[Fotiman]

Not to side track you, but you might look into the Yahoo UI Library [developer.yahoo.com]. The Grids [developer.yahoo.com] piece does stuff just like this. So you might find that useful.

[edited by: Fotiman at 4:15 pm (utc) on Aug. 4, 2006]

[Red_Eye]

Fotiman

Thanks for that, the CSS grids stuff looks great but I think that it is overkill for this project. I will work through it and bear it in mind for the future.

Any other suggestions.

Regards,

James

[blip]

<div id="leftfixed">
content
</div

You didn't close this div. Might be the problem.

[Red_Eye]

No This isn't from the page. I just typed it out as an example. So this is just my poor typing.

I am looking for the method.

[Fotiman]

div#rightfluid
{
float:left;
width:auto;
/*width:100% doesn't work*/
}

not sure what I am doing wrong

Why are you floating this column? If you remove this float it should work (I think).

[Red_Eye]

Fotiman,

Thanks that almosted worked. In the end this worked

div#rightfluid
{
margin-left:320px;
width:auto;
}

best of all it works in firefox and IE need to test the rest.