Menu
I need to have a box (div) with some text over multiple lines, and this box needs to have a fixed width and a fixed max height.
I'm using the overflow: hidden; Now my problem is that if the last line doesn't fit in the div max height it will get cut (cutting just half of the line for example). What I want to do in this case is not to show the last line, and display ellipsis in the last one
My problem is not inserting ellipsis in a single text line (using the white-space: nowrap property), the main problem is that the text gets cutted in the last line, ellipsis is not an issue because in last case I can use jQuery to insert it
395
The two properties ( word-break and word-wrap ) differ rules and overflow of words: as mentioned earlier, word-wrap is used to break words that overflow their container, while the word-break property breaks all words at the end of a line, even those that would normally wrap onto another line and wouldn't overflow their ...
The <wbr> element If you know where you want a long string to break, then it is also possible to insert the HTML <wbr> element. This can be useful in cases such as displaying a long URL on a page.
The overflowing word that is otherwise unbreakable is broken into chunks of text using overflow-wrap: anywhere so that it fits in its container. It's important to note that anywhere is not yet supported by some browsers. The image below shows the browser support according to caniuse.com.
Go to Picture Format or Shape Format and select Arrange > Wrap Text. If the window is wide enough, Word displays Wrap Text directly on the Picture Format tab. Choose the wrapping options that you want to apply. For example, In Line with Text, Top and Bottom, and Behind Text.
Add
text-overflow: ellipsis;
to the Div
EDIT: ok, not possible for now, not in a standardized way.
BUT, it's possible to achieve it with experimental webkit features (see this topic), or to do it with JS through the solution written by this guy, and hosted on github.
94
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
