May 19, 2010

Truncating strings in css

Filed under “Stupid CSS Tricks”

I had no idea you could insert an ellipises into html with css, and combined with overflow and white-space directives you can very politely clip a string.

row_title {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

So instead of this:

Or this:

You get this sexxy beast: