css - 溢出 - 隐藏和 float 的左侧元素

Question

我在设置为溢出隐藏的父 div 中有一系列 div 作为列，但是当到达容器的右侧而不是溢出时，这些列正在换行。

这是代码的基本版本。

.column{
width:200px;
float:left;
}
<div style="overflow:hidden">
<div class="column"></div>
<div class="column"></div>
</div>

Answer 1

你应该使用 inline-bock 而不是 float:left;

http://jsfiddle.net/RgJk9/1/

.container { width: 300px; overflow: scroll; white-space: nowrap; }

.column{
  background-color: red;
  width:200px;
  height: 200px;
  display: inline-block;
}​

使用 HTML:

<div class="container">
  <div class="column"></div>
  <div class="column"></div>
</div>​