如果有足够的可用空间,如何在窗口宽度上均匀分隔列?

时间:2017-08-26 13:23:30

标签: javascript css twitter-bootstrap reactjs

我在div上使用Bootstrap的 col-lg-12 。当有可用列(/ data)时,它会很好地显示列。 PSB: enter image description here

但是当没有足够的信息时,右侧空间仍为空白。 PSB: enter image description here

在这种情况下,是否可以动态扩展可用列/ div的宽度以占据整个窗口?

1 个答案:

答案 0 :(得分:1)

如果我正确理解你的问题......你也使用col-lg-2来显示你的瓷砖。因此,您需要应用动态Bootstrap类col-lg - ##其中##是12 /(tile数)。

<div class="col-lg-12">
    <div class="row">
        <div class="col-lg-##"></div>
        <div class="col-lg-##"></div>
        <div class="col-lg-##"></div>
    </div>
</div>

你在第二张照片##中的col-lg-4为4x3 = 12。

当你有多个不分为12(例如5或7 - 11)的瓷砖时,你还需要决定做什么。

正如人们所评论的那样,您可以使用其他选项和框架来完全解决这个问题,但这会直接回答您的问题并使用Bootstrap。