Limited supportLimited browser support. Check compatibility before use.
Other Limited support

Custom ellipses

The text-overflow CSS property with a string value sets the string representing clipped text.

Other

Overview

The text-overflow CSS property with a string value sets the string representing clipped text.

Browser support

Feature Desktop Mobile
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
css.properties.text-overflow.string
9
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)

Syntax

CSS 
.truncated {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: " [Read more]";
}

Live demo

customabbreviatesymbol

CSS customabbreviatesymbol demo.

PreviewFullscreen

standard Ellipsis

CSS standard ellipsis demo.

PreviewFullscreen

arrowabbreviate

CSS arrowabbreviate demo.

PreviewFullscreen

Use cases

  • Using Custom ellipses

    The text-overflow CSS property with a string value sets the string representing clipped text.

Cautions

  • Limited browser support. Check compatibility before use.

Accessibility

  • Make sure visual changes are conveyed appropriately to assistive technology.

Related links

Powered by web-features