Разделитель в сетке

Андрей
Андрей
1.9K
3
Приветствую. В адаптивной сетке "col-xs-6 col-md-3" , при уменьшении размера экрана, когда из одной строки четыре элемента располагаются в двух строках по два, хотелось-бы добавлять разделитель типа
между верхним и нижним рядом. Это возможно ?

Комментарии: 3

  1. Андрей
    Андрей
    06.04.2016, 13:56
    Имеется ввиду разделитель типа hr.
    1. Александр Мальцев
      Александр Мальцев
      06.04.2016, 15:58
      Допустим у Вас такая разметка:
      <div class="col-xs-6 col-md-3">1 Блок</div>
      <div class="col-xs-6 col-md-3">2 Блок</div>
      <div class="clearfix visible-xs-block"></div>
      <div class="col-xs-6 col-md-3">3 Блок</div>
      <div class="col-xs-6 col-md-3">4 Блок</div>
      <div class="clearfix"></div>
      <div class="col-xs-6 col-md-3">5 Блок</div>
      <div class="col-xs-6 col-md-3">6 Блок</div>
      <div class="clearfix visible-xs-block"></div>
      
      Вам необходимо добавить элемент hr только на xs устройствах после каждого 2 блока. Будет так:
      <div class="col-xs-6 col-md-3">1 Блок</div>
      <div class="col-xs-6 col-md-3">2 Блок</div>
      <div class="clearfix visible-xs-block"></div>
      <hr class="visible-xs-block">
      <div class="col-xs-6 col-md-3">3 Блок</div>
      <div class="col-xs-6 col-md-3">4 Блок</div>
      <div class="clearfix"></div>
      <hr class="visible-xs-block">
      <div class="col-xs-6 col-md-3">5 Блок</div>
      <div class="col-xs-6 col-md-3">6 Блок</div>
      <div class="clearfix visible-xs-block"></div>
      <hr class="visible-xs-block">
      
    2. Андрей
      Андрей
      06.04.2016, 16:52
      Супер, всё получилось, спасибо.