demo · v150

Decoration Toggle

Pick a value. The underline below changes its behaviour over whitespace in real time.

Checking support for text-decoration-skip-spaces…
A morning walk along the headland in late October with the sea braiding into the rocks below, and gulls drawing slow circles overhead.

code

u {
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 0.18em;
}

.stage[data-skip="all"] u {
  text-decoration-skip-spaces: all;
}

.stage[data-skip="none"] u {
  text-decoration-skip-spaces: none;
}

.stage[data-skip="start"] u {
  text-decoration-skip-spaces: start;
}

.stage[data-skip="end"] u {
  text-decoration-skip-spaces: end;
}

.stage[data-skip="both"] u {
  text-decoration-skip-spaces: start end;
}

see also

implementation reference

Need the exact API surface, compatibility boundaries, errors, lifecycle, and source links? Read the matching gendn reference ↗