CSS – 并排浮动两个元素

我有两个div并排.我希望左侧的div占用尽可能多的空间而不将另一个div(右侧)推到下一行.

这就是我现在所拥有的：http://jsfiddle.net/RALza/

HTML

<div id="container">
    <div id="divA"> left text </div>
    <div id="divB">  right text </div>
</div>

CSS

#divA
{
  float:left;
  border:1px solid blue;
  width:100%;
}

#divB
{
  float:right;
  border:1px solid red;
}

解决方法

<div id="container">
    <div id="divB">  right text </div>
    <div id="divA"> left text </div>
</div>

#divA
{
  overflow:auto;
  border:1px solid blue;
}

#divB
{
  float:right;
  border:1px solid red;
}

将工作.

但是你应该指定浮动元素的宽度.