- I got requirement from the client that if the text is longer than text get truncated and display "..." at the end of the string.
- But the twist is I have to display "..." in ASP.NET GridView control for each cell.
I am working on my blog post formatting this day.
I have to display this as
Make use of available CSS property
text-overflow: ellipsis; which truncate text form the point where text is wraping and display "..." as we require to resolve our issue.
Solution for the First Problem
So out css class for DIV element to get "..." will be like:
border-bottom: 1px solid;
border-left: 1px solid;
border-right: 1px solid;
border-top: 1px solid;
This property is that its works for div, p type element. i.e for the block element. So it resolves my first problem.
Solution for the Problem 2
But the CSS
text-overflow not working for the html table element directly. And GridView control get converted in table structure when its render on client browser.
So to resolve this issue we have to use another CSS property call
table-layout : fixed; more about table-layout : http://www.w3schools.com/Css/pr_tab_table-layout.asp
text-overflow : ecllipsis is supported by IE6+, Google Chrome
text-overflow:eclipse reduce the cost of calculating no. char we can display in a given width and write some custom login to display "..." append with the string.