Bootstrap col不是内联的

时间:2016-04-04 04:42:02

标签: twitter-bootstrap margin inline col

您好我想使用bootsrap进行布局,但是col不能显示内联

<div class= "container">
      <div class="row">
       <div class="col-md-9 box1"
       <h1>Hello World</h1>
       </div>
      </div>

         <div class="row">
           <div class="col-md-3 box2"
           <h1>Hi World</h1>
           </div>
          </div>
      </div>

CSS

.box1 .box2 {
display: inline;
margin: 5px;
}

如果我没有在CSS中添加边距,则框显示内联,但是当我添加margin属性时,box2会下移。

1 个答案:

答案 0 :(得分:0)

<div class="col-md-9 box1"<div class="col-md-9 box2"在他们的结尾没有>。 如果要在同一行中显示2个标题,则必须将它们放在同一行,如:

<div class= "container"> <div class="row"> <div class="col-md-9 box1"> <h1>Hello World</h1> </div> <div class="col-md-3 box2"> <h1>Hi World</h1> </div> </div> </div>