Я пытаюсь применить фильтр ко всей веб-странице для создания перевернутого вида страницы.На странице есть фиксированные элементы (некоторые кнопки и т. Д.).Таким образом, самый простой способ - инвертировать цвет каждого элемента на веб-странице, включая кнопки с фиксированным положением.Чтобы инвертировать цвета, я использую следующий код CSS:
html {
filter: invert(100%) hue-rotate(180deg) brightness(105%) contrast(85%);
-webkit-filter: invert(100%) hue-rotate(180deg) brightness(105%) contrast(85%);
}
Это прекрасно работает в Chrome, но не в Firefox.Инвертирование работает, но оно меняет положение двух кнопок, которые определены следующим образом:
#takemetotopbtn {
display: none;
position: fixed;
width: 40px;
height: 40px;
overflow: hidden;
outline:none;
bottom: 20px;
right: 20px;
z-index: 99;
}
Я пытался изменить фильтры, но безуспешно.Ошибка не отображается.Я знаю, что это может быть дубликат аналогичных проблем в Firefox.Но другие вопросы в основном касаются некоторого div или некоторого элемента внутри другого элемента.
ИМО, этот вопрос отличается, так как фильтр применяется ко всей странице, и я не хочу применять фильтр к каждому элементу по одному слишком наивно.
Надеюсь, кто-тоуже столкнулся и решил проблему для Firefox (особенно для темы dark mode парни).