Флекс направление: столбец не отвечает на медиа-запрос для размеров экрана <= 768 ⇐ CSS

[Anonymous]

Простые карты CTA. Гибкое направление установлено на столбец для медиа-запроса
Я ожидал
css: < /p>
.pricing-container {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
gap: 2rem;
}

.pricing-plan {
flex: 1;
max-width: 400px;
background-color: #f2f2f2;
border-radius: 5px;
padding: 20px;
text-align: center;
}

.plan-button {
background-color: #ff6600;
color: white;
border: none;
border-radius: 5px;
padding: 10px;
}

@media (max-width: 768px) {
.pricing-container {
flex-direction: column;
height: 100%;
}

.pricing-plan {
width: 400px;
}
}
< /code>
html: < /p>


Lorem ipsum odor amet, consectetuer
$11.99/month
Sign Up


Lorem ipsum odor amet, consectetuer
$19.99/month
Sign Up


Lorem ipsum odor amet, consectetuer
$49.99/month
Sign Up




Подробнее здесь: https://stackoverflow.com/questions/794 ... -sizes-768