@Zbiten

Как поменять блоки местами с помощью css?

Есть такой блок:


Как на мобильных устройствах превратить его в такой:
5bb7a5d26cdc9336666928.png
  • Вопрос задан
  • 160 просмотров
Решения вопроса 1
Ankhena
@Ankhena Куратор тега CSS
Нежно люблю верстку
Смешно, но проще всего это решается на флоатах
https://codepen.io/anon/pen/mzrPoa

Вариант с order возможен, но заморочист при текущей разметке.
И тогда удобнее в обратном порядке.
Первой должна идти картинка, потом заголовок и текст.
Выстраиваются они с помощью columns в 2 столбца.
А когда в один столбец, вот тогда уже order.
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
@Andrey_Hmytron
Я бы сделал через position: absolute;
Как то так:
.box {
    max-width: 700px;
    position: relative;
    padding: 30px 30px 30px calc(50% + 20px);
    .image {
      position: absolute;
      left: 0;
      top: 0;
      width: 50%;
      height: 100%;
      overflow: hidden;
    }
  }
Ответ написан
Комментировать
Ваш ответ на вопрос

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

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