CSS set width to fill % of remaining area


Sorry for the slightly rubbish title. I could not think how to describe this one better.

I am trying to implement the Google Friend Connect members gadget on my site, (just got into the scheme and want to put it in without a major redesign, at least for testing sake).

My problem is as follows:

I have a container div that has a width of 90% of the main page (body). Inside this I am floating a div to the right and setting its width to 300px and putting the google gadget inside it. What I would like is to be able to have a div fill 95% of the space remaining to the left of the google gadget div.

I don't know if it is possible to be able to mix px and % with divs and widths.

I hope this makes sense.


Best Solution

It is. You're looking for a semi-fluid layout. The quest was was originally the holy grail of CSS implementation... But as you can see from that link (they're doing 3 columns, 2 fixed but it's easy to alter), it's a problem long solved =)