Почему вид страницы на responsive Desktop отличается от responsive Mobile
Делаю адаптив на странице и заметил одну вещь, которую я совсем не могу понять: у меня responsive mobile отличается от responsive desktop
Причем самая важная особенность состоит в том, что есть блок .center-block, который меняет свою ширину в зависимости от ширины экрана:
@media screen and (max-width: 767px)
.center-block {
width: 100%;
padding: 0 8px;
}
И тогда все выглядит нормально:
Но если я меняю на Mobile:
То все ломается, все блоки, которые находятся выше становятся в длину 980px (непонятно для меня почему), ширина .center-blockкак будто перестает воспринимать ширину экрана и меняться и страница ломается
До этого у меня жестко тупил localhost и выдавал следующую ошибку:
Error: Manifest request to /_nuxt/0e62de9e27088d02f526.hot-update.json timed out. at XMLHttpRequest.request.onreadystatechange
Не знаю насколько это взаимосвязано, но решил упомянуть
В чем проблема, что я делаю не так?
Ответы (1 шт):
Автор решения: Wraith
→ Ссылка
попробуй убрать screen and оставь:
@media (max-width: 767px)
.center-block {
width: 100%;
padding: 0 8px;
}