Bootstrap Tutorial - 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   w w  w  .  j  a v  a 2s  .c  o  m-->
<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><!--from w ww.j  a v a 2 s  .  co  m-->
<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 ww. j av  a 2s. co  m-->
<body style='margin:20px;'>

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


</body>
</html>

Click to view the demo