Menu
In this page there are some links at the left sidebar that get cropped with:
.widget-area .textwidget li { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } In Firefox/Chrome it's displayed properly: 
Unfortunately Internet Explorer 8/9/10...: 
The problem isn't IE 10 support for text-overflow:ellipsis.. for example this works on IE 10 too! What's wrong with my implementation? I also tried to add -ms-text-overflow:ellipsis, without any luck.
897
text-overflow: ellipsis only works when the following is true: Parent element is not set to display: inline (span's default,) You must use display: block or display: inline-block. The element's width must be constrained in px (pixels) – it doesn't work with values specified using % (percent.)
To force overflow to occur and ellipses to be applied, the author must apply the nowrap value to the white-space property on the element, or wrap the content in a <NOBR> tag.
Definition and Usage. The text-overflow property specifies how overflowed content that is not displayed should be signaled to the user. It can be clipped, display an ellipsis (...), or display a custom string.
Removing the word-wrap: break-word property should help.
65
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
