Bootstrap Container

In Bootstrap, container is used to set the content's margins dealing with the responsive behaviors of your layout. It contains the row elements and the row elements are the container of columns (known as grid system).

The container class is used to create boxed content.

There are two container classes in Bootstrap:

container
container-fluid

See the basic layout of a container:

<html>
 <body>
  <div class="container">
   <div class="row">
     <div class="col-md-xx"></div>
       ...
   </div>
   <div class="row">
     <div class="col-md-xx"></div>
       ...
   </div>
  </div>
 </body>

<!-- Mirrored from www.javatpoint.com/bootstrap-container by HTTrack Website Copier/3.x [XR&CO'2014], Tue, 21 Jun 2016 08:25:26 GMT -->
</html>

Bootstrap container example

<!DOCTYPE html>
<html lang="en">
  <head>
     <title>Job</title>
     <link rel="stylesheet" href="../maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"/>
  </head>
  <body>

<div class="container">  
  <h1>Container</h1>  
  <p>container content</p>
</div>  
  
<div class="container-fluid">  
  <h1>Container-fluid</h1>  
  <p>container-fluid content</p>
</div> 

  <script src="../ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
  <script src="../maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
  </body>
</html>

Test it Now

Next TopicBootstrap Jumbotron

← prev next →

Bootstrap Tutorial

Bootstrap Examples

Bootstrap Advance

Interview Questions

Bootstrap Container

Bootstrap container example