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.
Hello dpinkston,Thank you for sharing this solution with the community
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.