I am faced with a tricky situation in a data-driven application. I have really long names and a short field for them only available.

My idea was to use css-ellipsis to cut the length to appropriate one and then add a title attribute to show the full name. But this might be too obscure for users to find.

I am wondering how to solve this?

  • 1
    The solution is easy. Design the UI to accommodate the actual data that it is presenting.
    – JonW
    Sep 29, 2014 at 8:08

1 Answer 1


What @JonW is saying is key here. You should always have your content in mind when designing a UI, therefore if the names are long, you most definitely should have a long field instead of a short one to accommodate them.

That being said, and assuming you have already thought about this and your current situation impedes you from doing so, I found that the use of CSS ellipsis along with some tooltip functionality seem to do the trick quite well, and users found it to be intuitive and helpful.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.