---
layout: default
title:  "Tabs"
date:   2013-06-30 23:24:04
---

Tabs
====

<div class="tabs-container row-fluid">
  <ul class="tabs span4">
    <li data-target="#home" class="tab-anchor active">
      Home<i class="icon-arrow-right-2"></i></li>
    <li data-target="#tab2" class="tab-anchor">Tab 1<i class="icon-arrow-right-2"></i></li>
    <li data-target="#tab3" class="tab-anchor">Tab 2<i class="icon-arrow-right-2"></i></li>
    <li data-target="#this-tab" class="tab-anchor">Tab 3<i class="icon-arrow-right-2"></i></li>
  </ul>

  <div class="tab-content span8">
    <div class="tab-pane active" id="home"><p>Content 1</p></div>
    <div class="tab-pane" id="tab2"><p>Content 2</p></div>
    <div class="tab-pane" id="tab3"><p>Content 3</p></div>
    <div class="tab-pane" id="this-tab"><p>Content 4</p></div>
  </div>
</div>

<br />

~~~html
<div class="tabs-container row-fluid">
  <ul class="tabs span4">
    <li data-target="#home" class="tab-anchor active">
      Home<i class="icon-arrow-right-2"></i></li>
    <li data-target="#tab2" class="tab-anchor">Tab 1<i class="icon-arrow-right-2"></i></li>
    <li data-target="#tab3" class="tab-anchor">Tab 2<i class="icon-arrow-right-2"></i></li>
    <li data-target="#this-tab" class="tab-anchor">Tab 3<i class="icon-arrow-right-2"></i></li>
  </ul>

  <div class="tab-content span8">
    <div class="tab-pane active" id="home"><p>Content 1</p></div>
    <div class="tab-pane" id="tab2"><p>Content 2</p></div>
    <div class="tab-pane" id="tab3"><p>Content 3</p></div>
    <div class="tab-pane" id="this-tab"><p>Content 4</p></div>
  </div>
</div>
~~~