Skip to content

Instantly share code, notes, and snippets.

@rianrainey

rianrainey/Add Ellipsis to Single Line of Extra-long Text

Created December 12, 2012 16:28
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save rianrainey/4269273 to your computer and use it in GitHub Desktop.
Save rianrainey/4269273 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
Add Ellipsis to Single Line of Extra-long Text
/* http://css-tricks.com/snippets/css/truncate-string-with-ellipsis/ */
.truncate {
width: 250px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
@rianrainey
Copy link
Author

Note: The ellipsis only shows in Chrome if this class is given to the parent div. Any higher ancestor and the ellipsis doesn't work in Chrome.

@rianrainey
Copy link
Author

I just saw that FF now supports the ellipsis.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment