Skip to content

Instantly share code, notes, and snippets.

@nfreear

nfreear/text-overflow-css.html

Created August 1, 2012 21:42
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save nfreear/3231004 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save nfreear/3231004 to your computer and use it in GitHub Desktop.
Download ZIP
CSS3 - text-overflow: ellipsis | via quirksmode/PPK and w3schools
Raw
text-overflow-css.html
<!doctype html><title> CSS3 - text-overflow </title>
<style>
p.test {
border: 1px solid gray;
white-space: nowrap;
width: 35em;
overflow: hidden;
text-overflow: ellipsis;
}
</style>
<p class=test>
The text-overflow declaration allows you to deal with clipped text: that is, text that
does not fit into its box. The ellipsis value causes three periods to be appended to the text.
<p class=test>
Short paragraph.
<pre>
N.D.Freear, 1 Aug 2012.
* http://quirksmode.org/css/contents.html#link5
* http://quirksmode.org/css/textoverflow.html
* http://w3schools.com/cssref/css3_pr_text-overflow.asp
* http://stackoverflow.com/questions/5358468/truncating-long-strings-with-ellipsis-via-php-or-css-in-firefox?lq=1
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment