не работает адаптация на мобильном
Доброго времени суток! Впервые начал делать адаптивные шаблоны но наткнулся на такую проблему: уменьшив окно браузера до появления мобильной версии все работает корректно (мобильная версия отображается корректно) но зайдя через телефон после нескольких переходов по страницам на экран телефона высвечивается компьютерная версия а мобильная возвращается только после чистки истории, кеша и т. д. бразуреа, адаптацию делаю с помощью css атрибута @media, в чем может быть проблема, может нужно прописать какойто js?
|
Экстрасенсов тут нет,код в студию!
Если не хочешь давать код выясни в чем проблема конкретно, кэш или куки, если кэш попробуй с другого смарта, если куки то сам намудрил |
вот сам css код
@media only screen and (min-width: 240px) and (max-width: 768px){
body {
background-color: #fff;
background-image:none;
}
.block_ava {
padding-bottom: 0px;
border-bottom-width: 0px;
border-bottom-style: none;
}
.content_width {
width: 100%;
min-width:240px;
}
.container_bg {
display:none;
}
.menu_hor {
display: block;
}
#puzadpn {display:none;}
uMenuRoot li {
list-style-type: none; /* Убираем маркеры */
}
uMenuRoot ul {
margin-left: 0; /* Отступ слева в браузере IE и Opera */
padding-left: 0; /* Отступ слева в браузере Firefox, Safari, Chrome */
}
.uMenuRoot, .uMenuRoot li {margin:0px;padding:0px;list-style-type:none}
.uMenuRoot {margin-bottom:15px !important}
.uMenuRoot li a {
display:block;
text-decoration:none;
font-size:14px;
color:#ccc;
padding-top: 10px;
padding-bottom: 10px;
font-weight: normal;
}
.uMenuRoot li a:hover {
color:#FFF
}.content_width {-moz-box-shadow: 0px 0px 0px rgba(150, 150, 150, 00);
-webkit-box-shadow: 0px 0px 0px rgba(150, 150, 150, 0);
box-shadow: 0px 0px 0px rgba(150, 150, 150, 0);
filter: progid:DXImageTransform.Microsoft.Shadow(strength = 1, direction = 90, color = '#000000');
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(strength = 1, Direction = 90, Color = '#000000')";
width: 100%;
}
}
больше нет. Если 4 раза обновить страницу на смартфоне он переходит на пк версию пробовал и сдругого смартфона |
даже вот сайт полистайте страницы и мобильная версия превратиться в пк версию
|
юзай max-device-width и соответственно min-device-width
И вообще http://www.javascriptkit.com/dhtmltu...queries2.shtml |
все гораздо проще просто мне нужно было добавить
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> и все дела. |
Это не все то что было нужно в данном случае, так как при уменьшении окна браузера сайт превратится в мобильную версию, а это не есть хорошо.
p.s. что у тебя тайтлы и прочее содержимое тега <head> делает в <body> |
Цитата:
|
![]() |
| Часовой пояс GMT +3, время: 17:54. |