首页 > 解决方案 > 如何在列之间添加空格

问题描述

我使用 Bootstrap 创建 3 列。添加边框后,这些列相互堆叠。我试图更改填充和边距,但没有奏效。如何在列之间添加空格?

HTML

<h3>Simple Text Box Color</h3>
<div class="row">
<div class="col-md-4 black-border">
<h3>Sample Text Box</h3>
<p>Lorem ipsum dolor sit amet</p>
</div>
<div class="col-md-4 black-border">
<h3>Sample Text Box</h3>
<p>Lorem ipsum dolor sit amet</p>
</div>
<div class="col-md-4 black-border">
<h3>Sample Text Box</h3>
<p>Lorem ipsum dolor sit amet</p>
</div>
</div>

CSS

.black-border{border: 1px solid #000;}

堆栈列图像

标签: htmlcsstwitter-bootstrap

解决方案


尝试使用我在您的代码上测试过的保证金,它有效。

 <style>

.black-border{ padding-left:30px;
margin-top: 30px;
margin-bottom: 30px;
margin-right: 30px;
margin-left: 30px;
border: 1px solid #000;}
</style>

推荐阅读