Bootstrap div layout

Align div element to left or right

.pull-left floats an element left.


<!DOCTYPE HTML>
<html> 
<head> 
<link href="http://java2s.com/style/bootstrap.min.css" rel="stylesheet">
</head><!--from  ww  w.  j  a  v a2 s  .c  om-->
<body style='margin:20px;'>

  <div class="pull-left">This is a test.</div>

</body>
</html>

Click to view the demo

.pull-right floats an element right


<!DOCTYPE HTML>
<html> 
<head> 
<link href="http://java2s.com/style/bootstrap.min.css" rel="stylesheet">
</head><!--   www  .  j a  v  a  2s  .  com-->
<body style='margin:20px;'>

 <div class="pull-right">This is a test.</div>

</body>
</html>

Click to view the demo

.clearfix clears the float on any element.


<!DOCTYPE HTML>
<html> 
<head> 
<link href="http://java2s.com/style/bootstrap.min.css" rel="stylesheet">
</head><!--   w  w  w  .  j a v a 2 s .c o m-->
<body style='margin:20px;'>

<div class="clearfix">this is a test.</div>


</body>
</html>

Click to view the demo





















Home »
  Bootstrap »
    Bootstrap »




Introduction
Basic HTML Style
List
Table
Form
Layout
Navigation Bar
Button
Control