Bootstrap Skeleton
This is a simple Bootstrap skeleton. You can fork it to get a ready to use Bootstrap fiddle.
by Amy L
HTML
<script src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.0/bootstrap.min.js"></script>
<div class="container-fluid color-back">
Some text
</div>
<div class="parent hidden">
<div class="current">
<div class="row">
<div class="col-xs-6 col-md-4">
<div class="contents">.col-xs-6 .col-md-4</div>
</div>
<div class="col-xs-6 col-md-4">
<div class="contents">.col-xs-6 .col-md-4</div>
</div>
<div class="col-xs-6 col-md-4">
<div class="contents">.col-xs-6 .col-md-4</div>
</div>
</div>
</div>
</div>
<div class="parent">
<div class="container-fluid color-back">
<div class="row">
<div class="col-xs-6 col-md-4">
<div class="contents">.col-xs-6 .col-md-4</div>
</div>
<div class="col-xs-6 col-md-4">
<div class="contents">.col-xs-6 .col-md-4</div>
</div>
<div class="col-xs-6 col-md-4">
<div class="contents">.col-xs-6 .col-md-4</div>
</div>
</div>
</div>
</div>
<div class="parent">
<div class="row bug">
<div class="col-xs-6 col-md-4">
<div class="contents">.col-xs-6 .col-md-4</div>
</div>
<div class="col-xs-6 col-md-4">
<div class="contents">.col-xs-6 .col-md-4</div>
</div>
<div class="col-xs-6 col-md-4">
<div class="contents">.col-xs-6 .col-md-4</div>
</div>
</div>
</div>
CSS
@import url('//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css');
.color-back {
background-color: red;
}
.parent {
background-color: grey;
margin: 0 auto;
max-width: 1024px;
}
div[class^="col-"] {
background-color: rgba(0, 0, 200, .4);
}
.contents {
border: 1px dashed silver;
}
.current {
background-color: yellow;
}
/*
.bug.row {
margin-left: unset;
margin-right: unset;
}
*/
.bug.row [class=^="col-"]{
box-sizing: border-box;
}