I'm having a problem getting the width of a simple RadGrid to be less than 100% while using a custom skin. The following code works as expected (version 2008.3.1105.20):
The master table gets rendered in HTML as:
However, this code does not work as expected (the only difference is that I provide the name of a skin)
This time, the master table gets rendered in HTML as:
Notice how the rendered HTML includes "width: 100%" in the style tag. This forces the grid to take up the entire width of the page (or container) instead of only as much as is needed, like in the first example. How can I force the master table to render without this style tag when I am using my own custom skin?
Thanks for your help.
| <telerik:RadGrid ID="rg" runat="server" DataSourceID="SqlDataSource1" AutoGenerateColumns="false" |
| Skin="" EnableEmbeddedSkins="false"> |
| <MasterTableView> |
| <Columns> |
| <telerik:GridBoundColumn DataField="ProductName" HeaderText="Product Name" UniqueName="ProductName" |
| HeaderStyle-Width="300" /> |
| <telerik:GridBoundColumn DataField="UnitPrice" HeaderText="Unit Price" UniqueName="UnitPrice" |
| HeaderStyle-Width="85" /> |
| </Columns> |
| </MasterTableView> |
| </telerik:RadGrid> |
| <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>" |
| ProviderName="System.Data.SqlClient" SelectCommand="SELECT ProductName, UnitPrice FROM Products" /> |
The master table gets rendered in HTML as:
| <table id="rg_ctl00" cellspacing="0" border="1" rules="all" style="border-collapse: collapse; table-layout: auto; empty-cells: show;"> |
However, this code does not work as expected (the only difference is that I provide the name of a skin)
| <telerik:RadGrid ID="rg" runat="server" DataSourceID="SqlDataSource1" AutoGenerateColumns="false" |
| Skin="Test" EnableEmbeddedSkins="false"> |
| <MasterTableView> |
| <Columns> |
| <telerik:GridBoundColumn DataField="ProductName" HeaderText="Product Name" UniqueName="ProductName" |
| HeaderStyle-Width="300" /> |
| <telerik:GridBoundColumn DataField="UnitPrice" HeaderText="Unit Price" UniqueName="UnitPrice" |
| HeaderStyle-Width="85" /> |
| </Columns> |
| </MasterTableView> |
| </telerik:RadGrid> |
| <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>" |
| ProviderName="System.Data.SqlClient" SelectCommand="SELECT ProductName, UnitPrice FROM Products" /> |
This time, the master table gets rendered in HTML as:
| <table id="rg_ctl00" class="MasterTable_Test" cellspacing="0" border="0" style="width: 100%; border-collapse: collapse; table-layout: auto; empty-cells: show;"> |
Notice how the rendered HTML includes "width: 100%" in the style tag. This forces the grid to take up the entire width of the page (or container) instead of only as much as is needed, like in the first example. How can I force the master table to render without this style tag when I am using my own custom skin?
Thanks for your help.
1 Answer, 1 is accepted
0
Hi Jon,
The 100% width is required by the RadGrid MasterTableView, as the RadGrid control has a more complex rendering (compared to asp:GridView for example).
However, in some scenarios the MasterTableView width can be safely removed by using the following code:
<MasterTableView style="width:auto" />
Best wishes,
Dimo
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
The 100% width is required by the RadGrid MasterTableView, as the RadGrid control has a more complex rendering (compared to asp:GridView for example).
However, in some scenarios the MasterTableView width can be safely removed by using the following code:
<MasterTableView style="width:auto" />
Best wishes,
Dimo
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.