css - CSS - 填充浮动元素旁边的剩余宽度并防止内容落在浮动元素下方？

Question

我遇到的问题是我需要将一个具有固定宽度的元素向左浮动，并在它旁边有一个元素填充剩余的宽度。

我知道的唯一解决方案是浮动第一个元素，然后它旁边的元素将自动填充剩余的宽度。我遇到的问题如下：

如果绿色含量高于红色，它会跳到红色下方。有什么办法可以防止这种情况发生吗？我玩过，clear但我不认为我可以做任何事情来防止它发生。

更糟糕的是，该网站是响应式的。如果不是，我可以给绿色元素一个静态宽度并浮动它，但事实并非如此。我不能使用百分比，因为红色元素具有静态宽度。

我相信 flexbox 有我正在寻找的东西，但不幸的是，由于缺乏支持，它现在不是一个选择。

想法？

score 3 · Accepted Answer

编辑：

CSS 代码应如下所示：

.floated {
  width:200px; float:left; 
}

.fill {
  margin-left:200px;
}

1 回答 1