Skip to content

Instantly share code, notes, and snippets.

@chivincent

chivincent/bootstrap-grid-demo.html Secret

Created December 1, 2014 11:57
Show Gist options
  • Save chivincent/7227d465d0a82666a6b2 to your computer and use it in GitHub Desktop.
Save chivincent/7227d465d0a82666a6b2 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
bootstrap-grid-demo.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Bootstrap Demo</title>
<!--Bootstrap-->
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet">
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
<!--jQuery-->
<script src="jquery/jquery-2.1.1.min.js"></script>
<style>
.a{
height: 100px;
color: white;
font-size: 20pt;
}
</style>
</head>
<body>
<h1>col-xs-1 * 12</h1>
<div class="row">
<div class="a col-xs-1" style="background-color:green">col-1</div>
<div class="a col-xs-1" style="background-color:red">col-1</div>
<div class="a col-xs-1" style="background-color:blue">col-1</div>
<div class="a col-xs-1" style="background-color:gray">col-1</div>
<div class="a col-xs-1" style="background-color:lightgray">col-1</div>
<div class="a col-xs-1" style="background-color:lightblue">col-1</div>
<div class="a col-xs-1" style="background-color:darkgray">col-1</div>
<div class="a col-xs-1" style="background-color:darkblue">col-1</div>
<div class="a col-xs-1" style="background-color:darkred">col-1</div>
<div class="a col-xs-1" style="background-color:yellow">col-1</div>
<div class="a col-xs-1" style="background-color:lightyellow">col-1</div>
<div class="a col-xs-1" style="background-color:#bbb">col-1</div>
</div>
<hr>
<h1>col-lg-6</h1>
<div class="row">
<div class="a col-lg-6" style="background-color: green">col-lg-6</div>
</div>
<hr>
<h1>col-md-6</h1>
<div class="row">
<div class="a col-md-6" style="background-color: red">col-md-6</div>
</div>
<hr>
<h1>col-sm-6</h1>
<div class="row">
<div class="a col-sm-6" style="background-color: blue">col-sm-6</div>
</div>
<hr>
<h1>col-xs-6</h1>
<div class="row">
<div class="a col-xs-6" style="background-color: black">col-xs-6</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment