I a problem that I am having difficulty resolving. I have a WebHierarchicalDataGrid that has multiple columns, bound at runtime, that I would like to limit to a specific fixed width. If the column has more data than the width can accomodate, I want the grid to truncate it. I've tried setting the CSS styles using App Stylist but even though my Item style for WebDataGrid has "overflow: hidden;" if a column has too much data, it doesn't truncate the excess. It just wraps to another line. I'd appreciate any suggestions on how I can resolve this issue.
Hello dpinkston,
are you trying to achieve something like this:
if so you could use white-space:nowrap;
<style type="text/css"> tbody.igg_Item > tr > td { white-space:nowrap; } </style>
I hope this helps
Thank you Hristo. That's exactly what I wanted.
When I read the online description of the CSS overflow property at w3schools.com, I thought that was what I needed. I'm still not sure what it does, but white-space does what I want..
Ooops, I was mistaken. You answer was only 99% of what I wanted. I created the CssClass as you suggested and put it into my Column's CssClass property. The results are almost what I want. All the columns to which I apply the CssClass are truncating, except for the ones in the first row of the datagrid. That row still wraps all columns. Is there some way around this difficulty? Maybe a style that is applied only to the first row? (this is the top level band of a 1 table WHDG).
Do you mean the row with columns header? Can you attach screenshot?
Please take a look at this article: http://blogs.infragistics.com/blogs/engineering/archive/2010/08/25/webdatagrid-css-styling-guide.aspx
I had already read the info on css styling that you refrenced but didn't see an answer to my question. I was hoping that there was some other style involved that wasn't documented.
I didn't mean the row of column headers, if that's what you were asking. I meant the first row in the data grid with data. Here's a screen shot:
As you can see the Shipment Type and Move Status columns are wrapping for the first row, but not on subsequent rows.
Well, I finally resolved this issue with the first row not wrapping. I was using IE9 in compatiblity mode for this page. As soon as I turned it off, the first row stopped wrapping.
Hello dpinkston,Thank you for sharing this solution with the community