Bootstrap Tutorial - Create two columns with col-4 anc col-8








The following code shows how to create two columns with col-4 anc col-8.

Example

<!DOCTYPE html>
<html>
<head>
<script type='text/javascript'
  src='http://code.jquery.com/jquery-2.0.2.js'></script>
<link rel="stylesheet" type="text/css"
  href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/css/bootstrap.min.css">
<script type='text/javascript'
  src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/js/bootstrap.min.js"></script>
<style type='text/css'>
.box1 {<!--   ww w  .j a  v  a 2  s  . co m-->
  background-color: green;
}

.box2 {
  background-color: blue;
}
</style>
</head>
<body>
  <div class="container">
    <div class="row">
      <div class="col-4">
        <div class="box1">
          <h1>Test</h1>
        </div>
      </div>
      <div class="col-8">
        <div class="box2">
          <h1>Test2</h1>
        </div>
      </div>
    </div>
  </div>
</body>
</html>

Click to view the demo