Почему правка стилей отображается на десктопе, но не на телефоне?

Question

[Владислав Бойченко]

Делаю адаптив на сайте через media-queries. Все хорошо работает, но в одном месте на десктопе в Инструментах разработчика все показывает правильно, а когда смотришь с телефона - изменений - ноль.
Там таблица, я ячейкам задаю float: left, чтобы они одна за другой встали, так как весь ряд на телефоне не помещается.
И вот не могу понять, почему в Инструментах разработчика все нормально отображается, а на телефоне - нет. Кэш чистил, везде.

Comments

[Павел]

А вы уверены, что ширина телефона у вас 320? Стили прописаны для 375, 425, 480 ?

[Владислав Бойченко]

Павел: медиа-запрос под 768рх

[Павел]

Владислав Бойченко: тогда экстрасенсы требуют ссылку

[Владислав Бойченко]

Павел: вот: kinderbest.ru Зайдите в любую категорию с телефона, посмотрите, блоки категорий не меняются, хотя в Средствах разработчика и прочих буржуйских онлайн-сервисах для проверки адаптивности все красиво выстраивается.

[Павел]

Владислав Бойченко: я бы таблицу переверстал бы)) а вообще попробуйте

@media only screen and (max-width: 1000px)
.category_table tr {
 display: block;
}
@media only screen and (max-width: 1000px)
.category_table td {
    display: block;
}

[Владислав Бойченко]

Павел: не сработало.

Answer 1

[Андрей Верх]

Инструменты разработчика в браузере, это просто изменение размера области просмотра.
А в мобильных браузерах, могут быть свои особенности.

Но в данном случае, мне кажется дело в

Там таблица, я ячейкам задаю float: left

. Это какая-то странная "техника". Покажите кусок ХТМЛ/КСС кода

Comments

[Владислав Бойченко]

Вот, собственно, сайт: kinderbest.ru

[Андрей Верх]

Владислав Бойченко: У вас там действительно таблица...Скорее всего в этом и дело. Переделайте на DIV'ы и всё будет как надо.
Или попробуйте задать ячейкам, рядам и таблице, disblay:block. Возможно поможет.