Как изменить положение элемента при сжатии экрана?

Question

[Полина Титова]

На данный момент так выглядят два элемента.

Как можно с помощью стилей изменить структуру, чтоб в мобильной версии они стояли не по горизонтали, в а по вертикали?

Answer 1

[WapSter]

@media (max-width: 500px) {
   // твои стили
}

500px замени на свое.

Answer 2

[Kostya10295]

Ну если они на флексбоксах, то flex-direction: column; или задать flex-wrap: wrap;

Comments

[Ankhena]

Достаточно поменять display на initial.
А еще лучше верстать mobile first, будет легче.

[WapSter]

Ankhena, лучше все же такие вещи оставлять флексами, контроля больше. У обычных блоков схлопывание может произойти к тому же.

[Ankhena]

WapSter,

У обычных блоков схлопывание может произойти к тому же.

И отлично, что произойдет.
Научит писать отступы подумав, а не абы как.

флексами, контроля больше.

Чем это?
Стоят блоки друг под другом по умолчанию и прекрасно. Им не нужен никакой контроль. А кода писать заметно меньше.

Answer 3

[Ankhena]

Верстать mobile-first.
Тогда сначала будет обычный блок и ничего писать не нужно, а при расширении добавлять флекс или грид.
Делается это через @media