When should I use container and row in Twitter Bootstrap 3?

Question

Please explain to me when to use the classes container and row. I\'m not sure because the documentation of Bootstrap is quite unclear about this pa

Answer 1

container is a container of row elements.

row elements are containers of columns (the docs call it grid system)

Also, container sets the content's margins dealing with the responsive behaviors of your layout.

Thus the container class is often used to create 'boxed' contents based on the style guidelines of the Bootstrap project.

If you want to go "out of the box" creating a full width grid you can use only row elements with columns inside (spanning the usual 12cols total).

The container and row classes are for elements inside the body. So a basic layout would be:

 
  

   

     

       ...
   
   

     

       ...
   
  
 

For a boxed responsive layout.

If you omit the container you'll get a full-width layout.

Jumbotron example

Jumbotron is a good example of the container behavior. If you put a Jumbotron element in a container element it has rounded borders and a fixed width based on the responsive width. If the Jumbotron is outside a container, it spans full-width without borders.