Ellipsis is not working properly in case of long URL. In case of URLs, it is treating / as special character and is breaking at every occurrence of /.
.ui-jqgrid tr.jqgrow td
{
font-weight: normal;
overflow: hidden;
text-overflow: ellipsis;
-moz-binding:url('ellipsis-xbl.xml#ellipsis');
white-space: normal !important;
height: 22px;
padding: 4px 2px 4px 2px;
border-bottom-width: 1px;
border-bottom-color: inherit;
border-bottom-style: solid;
}
Any idea how to escape special character in ellipsis?
You need to set white-space: nowrap;
in order for the ellipsis behaviour to work as you expect.
HTML
<div class='ellipsis'>http://stackoverflow.com/questions/22609623/ellipsis-not-working-for-long-url</div>
CSS
.ellipsis {
font-weight: normal;
overflow: hidden;
text-overflow: ellipsis;
-moz-binding:url('ellipsis-xbl.xml#ellipsis');
white-space: nowrap;
height: 22px;
padding: 4px 2px 4px 2px;
border-bottom-width: 1px;
border-bottom-color: inherit;
border-bottom-style: solid;
width:100px; /* set as an example */
}