Skip to main content
Stack Overflow
  1. About
  2. For Teams

Return to Revisions

2 of 2
Indicated missing line

text-decoration-thickness transition in Chromium

This CSS transition works in Gecko (Firefox) and WebKit (Safari) browsers but not in Chromium. Is it a Chromium bug or is there a more specific implementation to make this work? I can't find anything about this issue in the Chromium issues or anywhere else. Surely I am not the first one trying to transition text-decoration-thickness...?

a {
 /* the line below (or similar) was missing
 from the original question,
 but it is critically important to reproduce
 the effect — SA
 */
 text-decoration: underline; 
 text-decoration-skip-ink: none;
 text-decoration-thickness: 2px;
 transition: text-decoration-thickness 1s;
}
a:hover {
 color: red;
 text-decoration-thickness: 10px;
}
<!DOCTYPE html>
<html>
<body>
 <a>This is an anchor</a>
 </body>
</html>

Important note: I am not looking for a workaround to make lookalike text decoration. I am questioning spec compliance.

m4rrc0
  • 181
  • 1
  • 6
default

AltStyle によって変換されたページ (->オリジナル) /