How to place two containers in bootstrap side by side?

Question

I try to place two containers side by side, but they are stacked on top of each other. Even container-fluid class doesn't help.

<div class="container-fluid">     <div class="row">         <div class="col-lg-12">             Container Left         </div>     </div> </div>  <div class="container-fluid">     <div class="row">         <div class="col-lg-12">             Container Right         </div>     </div> </div> 

Is it possible in Bootstrap?

Answer 1

Bootstrap uses a 12-column grid, so each one of your divs will take up a row unto itself. You've also placed each one in a row, and rows will always stack. Try this:

<div class="container-fluid">     <div class="row">         <div class="col-lg-6">             Container Left         </div>         <div class="col-lg-6">             Container Right         </div>     </div> </div>