我有一个响应式的2列布局。第一列是固定宽度，而第二列使用css calc属性从其100%宽度中减去某些像素。
我想让第二列做的是水平滚动，无论屏幕大小或宽度。我随手拿起一支笔来说明我要做的事情:http://codepen.io/trevanhetzel/pen/nbdIt
可以看到，第二列里面有多个.thingdiv，它们向左浮动，并且有一个定义的宽度。我不想要的是这些.thingdiv下拉到另一行时，他们跑出第二列内的空间。
如何做到这一点?我试图搞乱overflow属性，但我想我可能需要另一个容器div与一些不同的定位属性或其他东西。任何建议吗?
给你:http://codepen.io/seraphzz/pen/lutjb
解决方法是:
- 将
.thing从float: left;更改为display: inline-block;。这使这些元素保持在一行中，但也使它们保持在流中，因此父元素承认它有子元素 - 给
section一个white-space: nowrap;属性。这可以防止.thing元素移到另一行。 - 给
section和overflow-x: auto属性。这允许div水平滚动，但如果没有足够的子元素需要它，则隐藏滚动条。 最后，给
section一个font-size: 0属性。默认情况下，display: inline-block的元素被视为文本，因此被赋予自动边距。在这些元素的父元素上设置font-size: 0将删除自动边距，允许您按照自己的喜好设置边距。请记住，如果这些子条目包含文本，则需要手动设置它们的字体大小。