Mail.ruПочтаМой МирОдноклассникиВКонтактеИгрыЗнакомстваНовостиКалендарьОблакоЗаметкиВсе проекты

Почему элементы не выстраиваются в столбик при сужении окна?

. Мастер (2487), на голосовании 3 дня назад
Вроде всё сделал по примеру, но результат неправильный.

 <!DOCTYPE html>  
<html>
<head>
<link rel="stylesheet" href="css/style.css">
<meta charset="UTF-8">
<title>Адаптивная верстка страницы</title>
</head>

<body>
<div class="container">
<div class="main"> Main</div>
<div class="leftside"> Aside</div>
<div class="bottom"> Aside</div>
</div>
</body>

</html>
 body{ 
margin: 0px;
}

.container{
display: flex;
flex-wrap: wrap;
}

.main, .leftside, .bottom{
width: 100%;
min-height: 100%;
height: 50px;
text-align: center;
}

.leftside{
background: #ffc5f8;
}
.main{
background: #fdeea6;
}
.bottom{
background: #94e07d;
}

@media(min-width: 854px){
.leftside{
flex: 0 0 33.333333%;
max-width: 33.333333%;
order: 1;
}

.main{
flex: 0 0 66.666667%;
max-width: 66.666667%;
order: 2;
}

.bottom{
flex: 50%;
max-width: 100%;
order: 3;
}
}
Дополнен 1 месяц назад
при разной ширине блоки не меняют положения
Голосование за лучший ответ
Косихина Эльвира Азизовна Профи (840) 1 месяц назад
Физика лучше
.Мастер (2487) 1 месяц назад
спорно
Косихина Эльвира Азизовна Профи (840) ., без порно давай
V̲i̲s̲t̲a̲s̲t̲e̲r̲ Искусственный Интеллект (267344) 1 месяц назад
Ну, а что ты хочешь, если не задан вьюпорт?

<meta name="viewport" content="width=device-width, initial-scale=1.0">
Похожие вопросы