<div class="tabs">
   <div class="tab">
    <input type="radio" id="tab1" name="tab-group" checked>
    <label for="tab1" class="tab-title">Вкладка 1</label> 
    <section class="tab-content">Один</section>
   </div> 
   <div class="tab">
    <input type="radio" id="tab2" name="tab-group">
    <label for="tab2" class="tab-title">Вкладка drekflr</label> 
    <section class="tab-content">Два</section>
   </div>
   <div class="tab">
    <input type="radio" id="tab3" name="tab-group">
    <label for="tab3" class="tab-title">Вкладка 3</label> 
    <section class="tab-content">Три</section> 
   </div> 
  </div>
 </body>
</html>

 .tabs {
    position: relative; /* Относительное позиционирование */
   }
   .tab, .tab-title {
    display: block; /* Выстраиваем по горизонтали */
    width: 50px;
   }
   .tab input[type="radio"] { display: none; }
   .tab-title {
    background: #ccc; /* Цвет фона */
    padding: 5px 10px; /* Поля вокруг текста */
    border: 1px solid #666; /* Параметры рамки */
    border-bottom: none; /* Снизу линию убираем */
   }
   .tab-content {
    position: absolute; /* Абсолютное позиционирование */
    border: 1px solid #666; /* Параметры рамки */
    padding: 10px; /* Поля вокруг текста */
    top: 0;
    left: 80px; /* Размещаем у левого края */
    width: 600px; /* Ширина содержимого */
    display: none; /* Прячем вкладку */
   }
   .tab :checked + .tab-title {
    position: relative; /* Относительное позиционирование */
    background: #fff; /* Цвет фона */
    top: 1px; /* Сдвигаем вниз */
    z-index: 1; /* Отображаем поверх содержимого */
   }
   .tab :checked ~ .tab-content {
    display: block; /* Показываем активную вкладку */
   }