The Prellipsis

To all who have a say in CSS standards:

Often us developers of the web come across a simple problem: Our line of text is too long to fit in its space.
The solution is a simple yet elegant truncate + ellipsis combo. Everything fits and users come to the obvious conclusion that there is more if they care to dig in.
Lovely.
However, many times the most important part of a line of text is not what is at the beginning, but what is at the end. A file path, for example. It is not very important that the file exists in C://Users/Documents/...
In most cases the user would rather know that the file path is .../Pictures/CoolPicOfSpace.jpg

"Simple" we say. Let's just truncate from the front in throw in our beloved triple dots. Easy.

False.

To achieve the same effect as our standard truncate, we must cast a dark magic spell with a combination of CSS and JavaScript. Even then, getting it to look exactly right while maintaining dynamic width capabilities is not a simple task.

The solution lies in a simple yet highly effective keyword: 'prellipsis'

In the CSS:

..filepath {
   text-overflow: prellipsis;
}

Simple and effective.

Thank you for your time.
I imagine I am not the only one who has brought this up, but I hope one day my dreams may be achieved.

Keep up the good work.

-Connor



Nothing in this message is intended to constitute an electronic signature unless a specific statement to the contrary is included in this message.

Confidentiality Note: This message is intended only for the person or entity to which it is addressed. It may contain confidential and/or privileged material. Any review, transmission, dissemination or other use, or taking of any action in reliance upon this message by persons or entities other than the intended recipient is prohibited and may be unlawful. If you received this message in error, please contact the sender and delete it from your computer.

Received on Wednesday, 24 February 2016 18:21:55 UTC