Question

因此，我正在使用仪表板外观，该外观可能具有四个可以打开的“正方形”，并且这些角色取决于用户角色。

通常会保留第一行，因为它的正方形大约为30％，另一行的宽度大约为70％。这可以。

但是，在仪表板的底行上，您可以有两个正方形。当两个都打开时，我当前的网格设置就可以正常工作，但是当一个用户“隐藏”一个正方形时，另一个正方形不会占据整个行。

这是我到目前为止所拥有的。我无法发布其中的任何元素，但这是大纲。

<div class="row">
    <div class="col-lg-3 col-md-4 col-sm-5"></div>
    <div class="col-lg-9 col-md-8 col-sm-7"></div>

</div>
<div class="row">
    <div class="col-lg-6 col-md-8 col-sm-6">
    </div>
    <div class="col-lg-6 col-md-8 col-sm-6">
    </div>
</div>

对此有任何解决方案，还是我必须处理某种后端逻辑才能确定用户是否显示了全部四列或只有三列？

Answer 1

您可以使用auto-layout col columns来填充宽度...

<div class="row">
    <div class="col">
        ...
    </div>
    <div class="col">
        ...
    </div>
</div>

https://www.codeply.com/go/Y0WwVS7KMd

删除div后的Bootstrap网格布局

1 个答案: