Where did you install Firefox from? Help Mozilla uncover 3rd party websites that offer problematic Firefox installation by taking part in our campaign. There will be swag, and you'll be featured in our blog if you manage to report at least 10 valid reports!

Tìm kiếm hỗ trợ

Tránh các lừa đảo về hỗ trợ. Chúng tôi sẽ không bao giờ yêu cầu bạn gọi hoặc nhắn tin đến số điện thoại hoặc chia sẻ thông tin cá nhân. Vui lòng báo cáo hoạt động đáng ngờ bằng cách sử dụng tùy chọn "Báo cáo lạm dụng".

Learn More

::before and ::after pseudo-elements override my safety css. How can I override them back?

  • 4 trả lời
  • 0 gặp vấn đề này
  • 1 lượt xem
  • Trả lời mới nhất được viết bởi cor-el

more options

Animation triggers my migraines.

Man websites use transition and animation timing functions such as "ease in-out" to animate the interface. I try to block this. Among other tools I use userContent,css, including the following:

  • {animation-timing-function: step-start !important}
  • {transition-timing-function: step-start !important}

This works to de-animate regular css elements, but not ::before and ::after pseudo-elements.

The current css standards do not apply user css to pseudo-elements. I've written to the WCAG about the issue.

https://bugzilla.mozilla.org/show_bug.cgi?id=1865572

https://github.com/w3c/wcag3/issues/40

But I really really need some way to de-animate these, because they trigger my migraines. Aside from css fixes, I often reduce the frame rate in about:config, but can't always do that, disable smooth scrolling, disable animated gifs and animated pngs, disable autoplay, block various non-scrolling elements using either css or uBlock Origin, etc.

Animation triggers my migraines. Man websites use transition and animation timing functions such as "ease in-out" to animate the interface. I try to block this. Among other tools I use userContent,css, including the following: *{animation-timing-function: step-start !important} *{transition-timing-function: step-start !important} This works to de-animate regular css elements, but not ::before and ::after pseudo-elements. The current css standards do not apply user css to pseudo-elements. I've written to the WCAG about the issue. https://bugzilla.mozilla.org/show_bug.cgi?id=1865572 https://github.com/w3c/wcag3/issues/40 But I really really need some way to de-animate these, because they trigger my migraines. Aside from css fixes, I often reduce the frame rate in about:config, but can't always do that, disable smooth scrolling, disable animated gifs and animated pngs, disable autoplay, block various non-scrolling elements using either css or uBlock Origin, etc.

Giải pháp được chọn

::after and ::before are global selectors, they only apply to specific pseudo-elements like which are mentioned in the MDN article.

*, ::before, ::after {animation-timing-function: step-start !important}
*, ::before, ::after {transition-timing-function: step-start !important}
Đọc câu trả lời này trong ngữ cảnh 👍 0

Tất cả các câu trả lời (4)

more options

Did you try a selector like ::after and ::before ?

https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_selectors

more options

The bug you linked mentions you can use the ::after and ::before selectors for targeting pseudo-elements which works for me.

more options

Uh, no.

I'm using global css, not domain-specific or element-specific css, because I need to de-animate *every* transition without having to diagnose and code for each website, with migraines from the still-animated transitions.

I'm not a programmer, and I can't read most of the online css manuals, so I may have missed something.

more options

Giải pháp được chọn

::after and ::before are global selectors, they only apply to specific pseudo-elements like which are mentioned in the MDN article.

*, ::before, ::after {animation-timing-function: step-start !important}
*, ::before, ::after {transition-timing-function: step-start !important}

Được chỉnh sửa bởi cor-el vào