Liquid Floating Elements Packed In A Container

Question

I have the following test code:

http://jsfiddle.net/b6QFY/1/

I want the “left” element to be fixed and the “right” element to be fluid in the parent container so that it increases and decreases as the browser width changes and does not wrap. It seems so simple, but you have a problem with the job.

Answer 1

My answer to another SO question

Edit: Here is your example (with replacing borders with bgs)

Answer 2

This is what I wanted to relate to . (I have to go to bed.)

Core:

, 100% .

, , IE6 , , 7.

Answer 3

you can use display:inline-block;

This article will help http://www.tjkdesign.com/articles/liquid/3.asp

Answer 4

Absolute positioning of the left element may be a more complete answer when other things come into play, such as container boundaries and backgrounds and organic growth of the right element.

See the previous answer.