Shortcode - Tab

<div class="tabs">
  <ul class="tab-nav">
    <li><a href="#picture">Pictures</a></li>
    <li><a href="#music">Music</a></li>
    <li><a href="#video">Videos</a></li>
    <li><a href="#document">Documents</a></li>
  </ul>
	<div class="tabs-content">
		<div id="picture" class="tab-content">Content under tab pictures</div>
		<div id="music" class="tab-content">Content under tab music</div>
		<div id="video" class="tab-content">Content under tab video</div>
		<div id="document" class="tab-content">Content under tab document</div>
	</div>
</div><!-- /tabs -->

Vertical Tabs

<div class="v-tabs">
  <ul class="tab-nav">
    <li><a href="#html">HTML</a></li>
    <li><a href="#css">CSS</a></li>
    <li><a href="#js">JavaScript</a></li>
    <li><a href="#twig">Twig</a></li>
  </ul>
	<div class="tabs-content">
		<div id="html" class="tab-content">Content under tab html</div>
		<div id="css" class="tab-content">Content under tab css</div>
		<div id="js" class="tab-content">Content under tab javascript</div>
		<div id="twig" class="tab-content">Content under tab twig</div>
	</div>
</div><!-- /tabs -->

Two Tabs in Two Column

<div class="items">
<div class="tabs">
  <ul class="tab-nav">
    <li><a href="#picture">Pictures</a></li>
    <li><a href="#music">Music</a></li>
    <li><a href="#video">Videos</a></li>
    <li><a href="#document">Documents</a></li>
  </ul>
	<div class="tabs-content">
		<div id="picture" class="tab-content">Content under tab pictures</div>
		<div id="music" class="tab-content">Content under tab music</div>
		<div id="video" class="tab-content">Content under tab video</div>
		<div id="document" class="tab-content">Content under tab document</div>
	</div>
</div><!-- /tabs -->

<div class="tabs">
  <ul class="tab-nav">
    <li><a href="#webhosting">Web Hosting</a></li>
    <li><a href="#cloud">Cloud</a></li>
    <li><a href="#email">E-mail</a></li>
    <li><a href="#vpn">VPN</a></li>
  </ul>
	<div class="tabs-content">
		<div id="webhosting" class="tab-content">Content under tab web hosting</div>
		<div id="cloud" class="tab-content">Content under tab cloud</div>
		<div id="email" class="tab-content">Content under tab email</div>
		<div id="vpn" class="tab-content">Content under tab vpn</div>
	</div>
</div><!-- /tabs --> 
</div><!-- /.items -->