Bootstrap col not inline

Question

Hi I want to make layout with bootsrap, but the col can't display inline

<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;
}

If I not add margin in CSS the box display inline, but when I add margin property the box2 go down.

Answer 1

<div class="col-md-9 box1" and <div class="col-md-9 box2" haven't got a > at their end. If you want to display the 2 titles in the same row, you have to put them to the same row like :

<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>