Изменить заказа Flex на мобильном телефоне по сравнению с настольным компьютеромHtml

Программисты Html
Ответить Пред. темаСлед. тема
Anonymous
 Изменить заказа Flex на мобильном телефоне по сравнению с настольным компьютером

Сообщение Anonymous »

Итак, у меня возникают проблемы, пытающиеся поменять Divs 1 и 2 на мобильных устройствах.
Затем выше 768px, заказ должен быть div 2 слева, установленной на 30% шириной. Затем на правых Divs 1 и 3 нужно сложить, взяв остаток справа. < /P>
Не уверен, как я могу это сделать. Я попробовал это без обертки, но я не мог заставить ее работать, это самое близкое, что у меня есть. < /P>
может кто -нибудь мне помочь?

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

.container {
display: flex;
flex-direction: column;
gap: 10px;
}

@media (min-width: 768px) {
.container {
flex-direction: row;
}

.specs {
flex: 0 0 30%;
order: 1;
}

.content-buttons {
flex: 0 0 70%;
display: flex;
flex-direction: column;
gap: 10px;
order: 2;
}

.content {
flex: 1;
order: 1;
}

.buttons {
flex: 1;
order: 2;
}
}

/* Borders for visualization */
.content {border: 1px solid red;}
.specs {border: 1px solid green;}
.buttons {border: 1px solid blue;}< /code>

2

1
3




Подробнее здесь: https://stackoverflow.com/questions/794 ... to-desktop
Реклама
Ответить Пред. темаСлед. тема

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

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

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

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

  • Похожие темы
    Ответы
    Просмотры
    Последнее сообщение

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