Ever wished your WebDataGrid could have Table Layout = Auto like old UltraWebGrid? Then it could automatically resize columns width to data width with respect line breaks. Well, it can, and in style (pan intended). Thanks to Infragistics tech-support for starting me in the right direction – here’s first 2 steps that need to be taken:

1. Don’t set column width property – either default or for specific column either in server-side code or declaratively and don’t set grid’s width property
2. Open your grid CSS class file, it’s located at ~/ig_res/[Your Style Name]/ig_dataGrid.css.
   Locate tbody.igg_[Your Style Name]Item>tr>td class and add one more line at the end: white-space:nowrap. Here is an example with Office 2007 Style:

   tbody.igg_Office2007BlueItem>tr>td
   {
   	background-color:White;
   	border-right:solid 1px #D0D7E5;
   	border-bottom:solid 1px #D0D7E5;
   	padding:2px 5px 2px 5px;
   	height: 18px;
   	overflow: hidden;
   	text-align:left;
   	vertical-align:middle;
   	white-space:nowrap;
   }

Run your project – you will get a nicely autoresized grid columns:

But there’s one problem with this approach. Continue reading →