3列动态宽度布局

Question

我希望有一个动态宽度的3列布局。这是我的情景。

1. 身体元素内的3个div。
2. 所有div的宽度都标记为auto，因此取决于div内的内容 div的宽度必须增长，以及它外面的身体元素。
3. 实际上div中的内容大多都有占位符，这些占位符由数据库提供数据，并且它们的长度动态增加。
4. 如果宽度增加，正文应附加水平滚动条。

我尝试浮动元素，显示它们inline-block并overflow-x: scroll/hidden，但没有任何效果。我觉得我错过了什么或做错了。

请帮助。

Answer 1

您想要设置百分比宽度。因此，width:33%;和display:inline-block的3列应该足够了。如果您的项目需要，position:relative;和/或overflow:hidden;可能适合在每列中包含元素。

注意，3列有点挑剔，所以如果33％不完美，请尝试使用小数33.333%，另一个常见的技巧是将最后一个elm浮动为.column:last-child{float:right}

希望这有帮助！