Bootstrap offers two types of layout fixed ( grid ) layout and flow type ( grid ) layout. Bootstrap grid layout is actually applied in a container (container). Fixed layout add a fixed width (width) of the vessel , flow layout add adaptive ( or called variable ) width of the container , this is the only difference between the two .
1. Fixed Layout
Let's look at an example:
class="container"
Code inside
.container,
{
width: 940px;
}
.container {
margin-left: auto;
margin-right: auto;
zoom: 1;
}
.container:before,
.container:after {
display: table;
line-height: 0;
content: "";
}
.container:after {
clear: both;
}
-
<body>
-
<div class="container">
-
<div class="row">
-
<div class="span4"> span4</div>
-
<div class="span8"> span8</div>
-
</div>
-
<div class="row">
-
<div class="span4"> span4</div>
-
<div class="span6"> span6</div>
-
<div class="span2"> span2</div>
-
</div>
-
</div>
-
</body>
-
<body>
-
<div class="container">
-
<div class="row">
-
<div class="span4"> span4</div>
-
<div class="span8"> span8</div>
-
</div>
-
<div class="row">
-
<div class="span4"> span4</div>
-
<div class="span6"> span6</div>
-
<div class="span2"> span2</div>
-
</div>
-
</div>
-
</body>
-
-
-
-