1

Имеется страница с использованием сетки bootstrap. На странице два элемента col-*, первое с контентом, второе с меню.

<div class="row">
<div class="col-md-9 col-12 content">
Контент
</div>
<div class="col-md-3 col-12 menu">
Меню
</div>
</div>

При просмотре с малых экранов верстка соответственно съезжает, контент сверху, а меню ниже. Мне необходимо, чтобы меню было сверху. Как это можно реализовать?

2

1 ответ 1

2

Визуальное изменение порядка работает для flex элементов. Дополнительно, посмотрите эту информацию

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-0evHe/X+R7YkIZDRvuzKMRqM+OrBnVFBL6DOitfPri4tjfHxaWutUpFmBp4vmVor" crossorigin="anonymous">

<div class="row">
  <div class="col-md-9 col-12 order-1 content">
    Контент
  </div>
  <div class="col-md-3 col-12 order-md-1 menu">
    Меню
  </div>
</div>

1
  • Большое Вам спасибо.
    – zerxa
    6 июн 2022 в 12:21

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.