I'm trying to cut a long text in a <td> but keep access to the data inside it. Maybe like on mobile by clicking and dragging inside the area.

I've done a post on stackoverflow for more details.

enter image description here

I didn't find any good UX alternative if I want to keep a fixed width in my <td>. Any ideas of what can be achieved ? Is it a good way to do it ?

Any live examples on how some websites deals with that ?

  • Have you considered simply continuing the text on a new line?
    – user68158
    Commented Sep 11, 2018 at 8:55
  • @Levano Yes but I don't want to break the layout, I want to keep it as in the example
    – Baptiste
    Commented Sep 11, 2018 at 8:56

2 Answers 2


Add ellipsis and show full text on mouse hover.

Example: ux.stackexchange profile page

enter image description here

If you need to perform some actions with the text, you can use an interactive tooltip.

Example: IBM's Interactive tooltip

enter image description here

  • 1
    I was about to suggest the same solution. Since the OP is having problems with path that is too long to fit, perhaps the field content should be the file name only with leading dots, like ...\filename.txt and the balloon text could contain the full path.
    – Mike
    Commented Dec 11, 2018 at 8:20
  • Agree, good point!
    – An Lev
    Commented Dec 11, 2018 at 11:31

Depending on the type of data, I see an additional few options:

  • Display full contents on hover (if data need only be read).
  • Displaying the data in a popout/dropdown with additional controls (e.g. a copy to clipboard button) if needed.

The scrollbar may still be appropriate, or used in conjunction with other solutions.

Your Answer

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

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