Mosaic CSS | Tabs

Tabs

Tabs organize and allow navigation between groups of content that are related and at the same level of hierarchy.

Test 1

Lorem ipsum dolor sit amet consectetur adipisicing elit. Perspiciatis odio cumque blanditiis eos nemo rem voluptas unde illo in, saepe alias pariatur iste reprehenderit autem? Ad omnis odit qui dolorum?

Test 2

Test 3

Test 4

  
  
<ul class="nav nav-tabs">
  <li class="nav-item><a class="nav-link" data-mdb-toggle="tab" href="#test1">Test 1</a></li>
  <li class="nav-item>
    <a class="nav-link active" data-mdb-toggle="tab" href="#test2">Test 2</a>
  </li>
  <li class="nav-item">
    <a class="nav-link disabled" data-mdb-toggle="tab" href="#test3">Disabled Tab</a>
  </li>
  <li class="nav-item><a class="nav-link" data-mdb-toggle="tab" href="#test4">Test 4</a></li>
</ul>
<div class="tab-content">
  <div class="tab-pane" id="test1">Test 1</div>
  <div class="tab-pane active" id="test2">Test 2</div>
  <div class="tab-pane" id="test3">Test 3</div>
  <div class="tab-pane" id="test4">Test 4</div>
</div>