@vacoo

Как сделать перестановку блоков в мобильной версии верстки?

Есть два блока
<div class="col-md-6 col-xs-12">1</div>
<div class="col-md-6 col-xs-12">2</div>


Они лежат горизонтально. В мобильной версии второй блок уходит вниз. Как сделать так чтобы в мобильной версии второй блок пошел вверх без перестроения блоков.
  • Вопрос задан
  • 1021 просмотр
Решения вопроса 1
@skazi_premiere
Верстаем как умеем ;) HTML/CSS/JS
Использовать pull и push Column ordering у Вас же Bootstrap?

vacoo: Применяйте к col-md
1 будет 2 в дестопе и 1м в мобильной.
2 будет 1 в десктопе и 2й в мобильной.
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
sergski
@sergski
web-developer
используйте flexbox:
<div class="box">
  <div class="col-md-6 col-xs-12">1</div>
  <div class="col-md-6 col-xs-12">2</div>
</div>


1-2
.box {
  display: flex;
  flex-direction: column;
}


2-1
.box {
  display: flex;
  flex-direction: column-reverse;
}
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы