Блок div смещается под другой div при уменьшении окна браузера!

Question

Блок div смещается под другой div при уменьшении окна браузера!

Глеб Мироненко Ученик (245), на голосовании 7 месяцев назад

Мужики надо что-бы при уменьшении окна, блоки вставали друг под друга. Как это сделать?
https://jsfiddle.net/ot18bcv5/

Answer 1

 @media (max-width: 800px) 
{
   Тут название первого дива
    {
     order: 1;
    }
    Тут название второго дива
    {
    order: 2;
    }
}

Примерно так, лучше к чату гпт обратись, нужно использовать функцию @media
Надеюсь правильно

Answer 2

Можно прописать медиа-запрос.

h1,
h3 {
text-align: center;
font-family: Arial, Helvetica, sans-serif;
}

.obshiy,
.obshiy2 {
border-radius: 10px;
width: 100%;
display: flex;
justify-content: center;
flex-wrap: wrap; /* Это свойство обеспечивает перенос элементов на новую строку */
}

.cc,
.ccg {
border: 2px solid black;
border-radius: 23px;
width: 160px;
height: 200px;
margin: 0.5% 2% 0.5% 2%;
text-align: center;
}

img {
margin: 10%;
}

/* Медиа-запрос для изменения стилей при уменьшении окна до 600px */
@media screen and (max-width: 600px) {
.cc,
.ccg {
width: 100%; /* При маленьком экране делаем ширину блоков равной 100% */
}
}

Должно сработать