это произошло при работе над конкретным проектом.У меня был div
со следующим css:
div.my-div {
position: sticky;
top: 60px;
}
(к нему также применяются другие стили, ни один из которых не влияет на значения css, связанные с position: sticky
).
этот div стал былипкая, когда страница прокручивается и достигает верхней части области просмотра, но при прокрутке немного больше исчезнет, как если бы ее заменял другой липкий элемент.в целях тестирования я закомментировал все остальные элементы на странице и вставил только фиктивный элемент div с достаточной высотой, чтобы включить прокрутку, и поведение осталось прежним.
это поведение также ограничивалось Chrome и Firefox (обапоследняя версия) и я не смог воспроизвести его в Safari.Удивительно, но этот фрагмент CSS исправил проблему:
html, body {
overflow-x: hidden;
}
установка overflow-x
на hidden
только на body
или html
не работала, и это исправление вызывало другую прокрутку только для Safari.связанные вопросы.
Я решил проблему, изменив значение overflow-x
на html
и body
, используя JS, в зависимости от того, является ли браузер Safari или нет.Тем не менее, я чувствую себя в целом неудобно с этим решением.у кого-нибудь еще были подобные проблемы?какие-либо идеи о том, что может быть причиной этого, и есть ли какие-либо решения для этого, не включая фрагменты JS, определяющие, является ли это Safari или нет?