Как позиционировать блоки с помощью flexbox?

Песочница.

1) Сейчас у меня в верстке данный select находится справа:

5b815aac70fde115917935.png

Но когда ему мало места, то он опускается ниже:

5b815b2184f0e245364224.png

Я хочу сделать так, чтобы когда ему не было места, он прижимался к левой стороне, а когда есть к правой.

2) Как выровнять данный фильтр по центру на мобильной версии? Пробовал разные свойства, но никак не получается.

5b815b840e98a243148596.png

3) Как вообще сделать адаптив на данной странице и как лучше позиционировать все эти блоки на меньших экранах?
  • Вопрос задан
  • 358 просмотров
Решения вопроса 1
sM0kfyz
@sM0kfyz
Frontend dev.
1) Можно с помощью медиазапросов
2) Добавить к .filter,
width: 100%;
display: flex;
flex-direction: column;
align-items: center;

если надо чтобы было по центру только для мобильной версии, то тоже медиазапросы. Если что, то смешивать их с Flexbox законно.
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
snap44
@snap44
Фыр!
1 у блока с селектом убрать авто-марджин слева и родителю добавить justify-content
Ответ написан
Комментировать
Ваш ответ на вопрос

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

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