Menu
i have the following example.
http://jsfiddle.net/qFDxp/
HTML:
<div class="test">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</div>
CSS:
.test
{
display: block;
height: 299px;
left: 230px;
overflow: hidden;
text-overflow: ellipsis;
top: 110px;
white-space: pre-line;
width: 199px;
z-index: 1;
background-color: #FFFFFF;
border: 1px solid #777777;
position: absolute;
}
What i wish?
Thank you in Advance!
463
CSS Demo: overflow-wrapThe width is set to min-content, with a max-width of 11em. Note: In contrast to word-break , overflow-wrap will only create a break if an entire word cannot be placed on its own line without overflowing.
Today I'm going to talk about a rarely used but extremely useful CSS property, the word-wrap. You can force long (unbroken) text to wrap in a new line by specifying break-word with the word-wrap property.
CSS word-wrap property is used to break the long words and wrap onto the next line. This property is used to prevent overflow when an unbreakable string is too long to fit in the containing box.
text-overflow: ellipsis only works on single line content as you need the line white-space:nowrap for it to work.
Check this post for some ideas for workarounds
118
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
