Home/ Questions/Q 6801903
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-26T19:09:28+00:00

It seems that text-overflow: ellipsis is dependent on white-space: nowrap . The problem with

  • 0

It seems that text-overflow: ellipsis is dependent on white-space: nowrap. The problem with this is that it limits the text to one line. However, what if I need to have 4 lines, and the ellipsis on the last line in the case of overflow?

What it’s currently doing…

Lorem ipsum dolor sit amet ...

What I want…

Lorem ipsum dolor sit amet, 
consectetur adipisicing el-
it, sed do eiusmod tempor  
incididunt ut labore et ...
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Unfortunately the behavior you are seeing is correct for text-overflow: ellipsis.

    Cross-browser support for hyphenated text is not a reality yet with CSS only, but you can see a good roundup of what’s possible here:
    http://code.google.com/p/hyphenator/wiki/en_CSS3Hyphenation

    Some browser-specific CSS is available for firefox and webkit browsers:

    -webkit-hyphens: auto;
-webkit-hyphenate-character: '~';
-moz-hyphens: auto;

    The big issue with hyphenation is that it needs to be language aware to work properly, which is tricky.

    Maybe a JS solution like this will help you?
    http://code.google.com/p/hyphenator/

    • 0