相关疑难解决方法(0)

Flexbox:如何让divs填充100%的容器宽度而不包装?

我正在更新旧inline-block的网格模型,我需要更新我创建的Flexbox.一切都运行良好,除了一个小障碍,这已经成为一个破坏者:

我有一堆CSS控制的滑块; 所以有一个包含100%宽度的包装器,里面是另一个div:它的宽度也是100%,但它white-space被设置为nowrap.使用inline-block,这意味着内部div(设置为100%宽度)不受父母约束的限制并且包裹在下一行 - 它们只是继续流出盒子.这正是我想要的.但是,我无法使用flexbox来完成这项工作.供参考,这是一张图片:

Flexbox问题

作为参考,这里是使用内联块的jsFiddle:http://jsfiddle.net/5zzvqx4b/

... 而不使用Flexbox:http://jsfiddle.net/5zzvqx4b/1/

我已经试过各种变化与flex,flex-basis,flex-wrap,flex-grow,等,但对我的生活,我不能得到这个工作.

请注意,我可以通过设置.boxcontainer宽度来强制它以一种hacky,不灵活的方式执行我想要的操作200%.这适用于这个单独的例子,但在某些情况下我不会事先知道将有多少个子盒子,如果可能的话,我宁愿不在每个元素上使用内联样式.

css css3 flexbox

49
推荐指数
4
解决办法
9万
查看次数

如何并排排列多个<div>元素

容器div中有三个div元素并排,宽度小于子总宽度.在这里您可以找到案例的小提琴:

我想让容器div水平滚动以显示其他孩子.

如何安排孩子不要在容器div内包装?它现在垂直滚动,我希望它水平滚动.

html css css-float

21
推荐指数
1
解决办法
5万
查看次数

标签 统计

css ×2

css-float ×1

css3 ×1

flexbox ×1

html ×1