twitter-bootstrap 引导行中的间距和填充/边距
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/34349549/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-21 23:27:14 来源:igfitidea点击:
Spacing and padding / margin in bootstrap row
提问by sridhar
I am having difficulties with understanding padding, margin and gutter.
我在理解填充、边距和装订线方面遇到困难。
Can anyone help me with getting the styling right for this design? I am not getting any space between and around the columns.
任何人都可以帮助我获得适合此设计的样式吗?我在列之间和列周围没有任何空间。
My current coding is:
我目前的编码是:
<div class = "container">
<div class = "row">
<div class = "col-md-12">
<h3>Heading</h3>
</div>
<div class = "col-md-12">
<div class = "row">
<div class = "col-md-8" style = "border: solid 1px #003c70;">
Some text
</div>
<div class = "col-md-4" style = "border: solid 1px #003c70;">
Some text
</div>
</div>
</div>
</div>
</div>
回答by Venugopal
回答by Mohamed Rihan
add a div inside of your colm
在你的 colm 里面添加一个 div
body{
background: #ddd;
}
header{
background: blue;
padding: 5px 0px;
color:#fff;
padding-left: 15px;
}
.boder{
border: 1px solid #333;
min-height: 350px;
padding:10px;
}
.wrapper{
margin-top: 15px;
}
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>
<header>
<h4>THIS IS HEADER</h4>
</header>
<div class = "container">
<div class = "row wrapper">
<div class = "col-md-12">
<div class = "row">
<div class = "col-md-8">
<div class="boder">
blah blah..
</div>
</div>
<div class = "col-md-4">
<div class="boder">
blah blah..
</div>
</div>
</div>
</div>
</div>


