Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
<script src="//code.jquery.com/jquery.min.js"></script>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
  <div class="container">
    <div class="row">
      <div class="col-xs-3 col-sm-3 col-md-3 col-lg-3 full-height sidebar">
        <h1>Lorem ipsum</h1>
        <h2>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam at porttitor sem.</h2>
        <div class="row tab-list">
          <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
            <ul id="desktopTabs" class="nav nav-tabs" role="tablist" data-tabs="tabs">
              <li class="separator"><span></span></li>
              <li class="active"><a href="#type" role="tab" data-toggle="tab">Tab 1</a></li>
              <li class="separator"><span></span></li>
              <li><a href="#brand" role="tab" data-toggle="tab">Tab 2</a></li>
              <li class="separator"><span></span></li>
              <li><a href="#model" role="tab" data-toggle="tab">Tab 3</a></li>
              <li class="separator"><span></span></li>
              <li><a href="#engine" role="tab" data-toggle="tab">Tab 4</a></li>
              <li class="separator"><span></span></li>
              <li><a href="#usage" role="tab" data-toggle="tab">Tab 5</a></li>
              <li class="separator"><span></span></li>
              <li><a href="#result" role="tab" data-toggle="tab">Tab 6</a></li>
              <li class="separator"><span></span></li>
            </ul>
          </div>
        </div>
      </div>
      <div class="col-xs-9 col-sm-9 col-md-9 col-lg-9 full-height tabs-content">
        <div class="tab-content">
          <div class="tab-pane fade in active" id="type">Content 1</div>
          <div class="tab-pane fade" id="brand">Content 2</div>
          <div class="tab-pane fade" id="model">Content 3</div>
          <div class="tab-pane fade" id="engine">Content 4</div>
          <div class="tab-pane fade" id="usage">Content 5</div>
          <div class="tab-pane fade" id="result">Content 6</div>
        </div>
      </div>
    </div>
  </div>
</body>
</html>
Output

This bin was created anonymously and its free preview time has expired (learn why). — Get a free unrestricted account

Dismiss x
public
Bin info
anonymouspro
0viewers