gpt4 book ai didi

css - 如何水平排列列?

转载 作者:太空宇宙 更新时间:2023-11-04 03:45:41 25 4
gpt4 key购买 nike

我有一个 bootstrap 3 页面,上面有 4 个孔。每口井的数据量不同,导致布局看起来很糟糕。

我想让第 3 口井和第 4 口井排在第 1 口井和第 2 口井的下方。我不介意井口顶部和底部之间存在空间。

这是我的 HTML:

<div class="container-fluid">
<div class="row-fluid">

<div class="col-sm-6">
<div class="well well-sm">
<div class="form-horizontal">
<fieldset>
<legend class="well-legend">Well 1</legend>
<p>Well 1 Content</p>
<p>Well 1 Content</p>
<p>Well 1 Content</p>
<p>Well 1 Content</p>
<p>Well 1 Content</p>
<p>Well 1 Content</p>
<p>Well 1 Content</p>

</fieldset>

</div>
</div>
</div>


<div class="col-sm-6">
<div class="well well-sm">
<div class="form-horizontal">
<fieldset>
<legend class="well-legend">Well 2</legend>
<p>Well 2 Content</p>
<p>Well 2 Content</p>
</fieldset>
</div>
</div>
</div>
</div>


<div class="row-fluid">
<div class="col-sm-10">
<div class="col-sm-6">
<div class="well well-sm">
<div class="form-horizontal">
<fieldset>
<legend class="well-legend">Well 3</legend>
<p>Well 3 Content</p>
<p>Well 3 Content</p>
<p>Well 3 Content</p>
<p>Well 3 Content</p>
<p>Well 3 Content</p>
<p>Well 3 Content</p>
<p>Well 3 Content</p>
<p>Well 3 Content</p>
<p>Well 3 Content</p>
<p>Well 3 Content</p>
</fieldset>
</div>
</div>
</div>


<div class="col-sm-6">
<div class="well well-sm">
<div class="form-horizontal">
<fieldset>
<legend class="well-legend">Well 4</legend>
Well 4 Content
</fieldset>
</div>
</div>
</div>
</div>
</div>
</div>

Bootply Link

最佳答案

如果这是您想要的,那么我认为您可能需要更换您正在使用的液体容器并只使用:

<div class="container">
<div class="row">

关于css - 如何水平排列列?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24166261/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com