Hi all. I have a small problem with these two blocks. Each floated to its own side. The right one should be the dominant one: as it grows horizontally, the left one should shrink commensurately. Of course, I don’t know how big the content in each will be. The one on the left is title and description; the one on the right is price and optional text, such as “per person”.
Thanks for your help,
That’s a good statement but if you want something answered you should probably rephrase it as a question.
Each floated to its own side. The right one should be the dominant one: as it grows horizontally, the left one should shrink commensurately.
Hi,
It sounds like you are not setting widths and letting the content determine the widths, in other words you are letting the floats shrinkwrap.
What makes you think the left float can shrink as the right float grows if the left floats width is determined by it’s content. If there is not enough space for both floats then one of them will drop, the one lower in the source order. To do something like that you would need to use one float only and set overflow:hidden; on the other block.
Show us some code and you will have a better chance of getting some help with this. 
Thx Rayzur and EricWatson. I’m thinking to achieve this need JS. Not opposed to this; just thought there may be a pure-CSS solution.
Have a lovely day.
just thought there may be a pure-CSS solution.
As I mentioned this should do what you are wanting …
To do something like that you would need to use one float only and set overflow:hidden; on the other block.