Может ли flexbox обнаружить, когда гибкий элемент переносится?CSS

Разбираемся в CSS
Ответить
Anonymous
 Может ли flexbox обнаружить, когда гибкий элемент переносится?

Сообщение Anonymous »

Я надеюсь избавиться от медиа-запросов и просто использовать flexbox для решения своей проблемы, но не уверен, возможно ли это. По мере того как окно становится меньше, я хочу, чтобы столбцы уменьшались до тех пор, пока не достигнут минимальной ширины. Как только они доберутся до него, средняя колонна спрыгнет вниз и перевернется.

Я думаю, мой вопрос сводится к следующему: может ли flexbox обнаружить, когда он переносится? Если да, могу ли я предложить ему изменить порядок элементов в переносе с помощью строго CSS?

Вот код того, что я пытаюсь выполнить с помощью медиа-запросов. .

Код: Выделить всё

.wrapper {
display: flex;
justify-content: center;
margin: 5px;
flex-wrap: wrap;
}

.red {
background-color: red;
height: 240px;
margin: 5px;
width: 500px;
order: 0;
}

.yellow {
background-color: yellow;
margin: 5px;
height: 240px;
min-width: 240px;
max-width: 400px;
flex: 1;
order: 1;
}

.blue {
background-color: blue;
height: 240px;
margin: 5px;
min-width: 350px;
max-width: 400px;
flex: 1;
order: 2;
}

@media (max-width:1130px) {
.yellow {
order: 4;
}
}



Подробнее здесь: https://stackoverflow.com/questions/434 ... item-wraps
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «CSS»