Чтобы обойти странные ошибки CSS в браузере Instagram в приложении, я использовал скрипт для динамической загрузки отдельного файла CSS при обнаружении браузера в приложении Instagram, который правильно стилизовал страницу. Стиль работает практически для всех элементов, кроме 5, и я не понимаю почему.
Я пробовал перемещать скрипт, использовать разные стили, возиться с html-файлами, но кажется, что к этим конкретным элементам ничего нельзя применить. Они не изменятся, что бы я ни поместил в CSS-файл.
Ниже приведена часть моего CSS-файла, которая не отображается:
.wrapper-3 { ширина: 100%; высота: 28%; } #resume-тег { высота: 12%; } #резюме { поле слева: 5%; ширина: 55%; } #swl { дисплей: нет; } #sws { дисплей: блок; поле слева: 5%; } Вот соответствующий HTML-код:
Вот CSS из файла, который работает:
.wrapper { ширина: 100%; высота: 68%; } #большой-логотип { дисплей: нет; } #small-logo { отображение: наследовать; поле: 255 пикселей авто 0 авто; } Вот скрипт, который я использую в своих html-файлах:
console.log(navigator.userAgent); // Выводим пользовательский агент на консоль вар isInstagram = /instagram/i.test(navigator.userAgent); если (isInstagram) { вар ссылка = document.createElement('ссылка'); link.rel = 'таблица стилей'; link.href = 'instagram.css'; document.head.appendChild (ссылка); } Если у кого-то есть какие-либо идеи, мы будем очень признательны.
Мобильная версия