text-decoration-skip-ink: all
The text-decoration-skip-ink: all CSS declaration forces interruptions in underlines and overlines where the line would cross a glyph. This contrasts with auto, which does not skip for CJK glyphs. It is useful when you need more deliberate control over presentation or behavior in a focused part of the interface.
Browser support
| Feature | Desktop | Mobile | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
all | | | 75 | 15.4 | | 15.4 |
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)
Syntax
CSS
.cjk-link {
text-decoration: underline;
text-decoration-skip-ink: all;
}Live demo
Use cases
-
Use text-decoration-skip-ink: all
Use text-decoration-skip-ink: all when the default CSS behavior is not expressive enough for the component or layout you are building.
-
Handle edge cases
Apply text-decoration-skip-ink: all to solve a specific styling constraint without introducing broader layout or behavior changes.
Cautions
- Test text-decoration-skip-ink: all in the browsers you support, especially if it changes layout, text handling, or interaction behavior.
- Plan a fallback or acceptable degradation path when support is still limited.
Accessibility
- Confirm that using text-decoration-skip-ink: all does not make content harder to perceive, understand, or operate in assistive contexts.