Skip to content

Instantly share code, notes, and snippets.

@himanshuteotia
Created October 26, 2017 13:16
Show Gist options
  • Save himanshuteotia/aa6cb6797c71344b6b4c2ca04d874ba3 to your computer and use it in GitHub Desktop.
Save himanshuteotia/aa6cb6797c71344b6b4c2ca04d874ba3 to your computer and use it in GitHub Desktop.
Bootstrap Reodring
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container-fluid">
<h1>Push and Pull</h1>
<p>Resize the browser window to see the effect.</p>
<div class="col-xs-12 col-lg-12">
<div class="col-lg-3 col-xs-6" style="background-color:lavender;">1</div>
<div class="col-lg-3 col-xs-6 col-lg-push-6" style="background-color:lavenderblush;">4</div>
<div class="col-lg-3 col-xs-6 col-lg-pull-3" style="background-color:lavenderblush;">2</div>
<div class="col-lg-3 col-xs-6 col-lg-pull-3" style="background-color:lavender;">3</div>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment