Bootstrap Grid / CSS：将较长的列包裹得更短

Question

在最右边的两列中，如果它更长，我想将左列包裹在右列周围。这意味着左列的子div应该扩展它们的宽度。我试过浮动右栏，但这不起作用。

我正在为列使用引导网格系统。基本上我所拥有的是

<div class="col-xs-6" >
<div class="col-lg-6 left-column">
</div>
<div class="col-lg-6 right-column">
</div>
</div>

如果您想自己玩实际网页，请访问：mighty-cliffs-9655.herokuapp.com

Answer 1

您需要做的是创建多个包装器。

尝试一下我刚刚给出了css值用引导网格替换它们的类。

％＆＃34;变量＆＃34;％=占位符（我假设你在CMS中工作）

您只需要将每个项目的高度设置为100％或自动，这应该可以完成工作！

<div class="wrapper width100% floatleft">
<div class="left width50% floatLeft">
    <div class="today floatLeft">%today%</div>
    <div class="tomorrow floatRight">%tomorrow%</div>
</div>
<div class="right width50% floatRight">
    <div class="sunday floatLeft">%sunday%</div>
    <div class="sidebar floatRight">%sidebar%</div>
</div>  
</div>