Databases
StackOverflow2013
Postsdbo
PO
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>I just ran into a similar issue. </p> <p>The site I'm working has has radGrids, which are re-sized when the browser window is re-sized. The radGrid header looked normal when the browser window size was small, but became misaligned as the browser size increased.</p> <p>I have UseStaticHeaders set to "true" and TableLayout set to "fixed". I'm also using specific Header Widths instead of percentages.</p> <p>When re-sizing radGrids, its best to leave off the width of one column. I noticed this wasn't the case on the grid I was working on. When I removed one column's width, the headers immediately aligned correctly.</p> <p>I'm not sure if this solution will work for you, but it worked for me.</p> <p><strong>UPDATE</strong></p> <p>Here's the markup for one of the grid's I've been working on:</p> <pre><code> &lt;telerik:RadGrid ID="grdItems" runat="server" OnNeedDataSource="grdItems_NeedDataSource" AutoGenerateColumns="False" Width="100%" Height="100%" GridLines="None" EnableOutsideScripts="True" PagerStyle-AlwaysVisible="true" PagerStyle-Mode="NextPrevAndNumeric" AllowPaging="true" PageSize="250" AllowSorting="true" OnItemCreated="grdItems_ItemCreated" OnItemCommand="grdItems_ItemCommand" OnPreRender="grdItems_PreRender" TabIndex="17" OnItemDataBound="grdItems_ItemDataBound" &gt; &lt;ClientSettings AllowColumnsReorder="true" ReorderColumnsOnClient="true" ColumnsReorderMethod="reorder"&gt; &lt;Selecting AllowRowSelect="False" /&gt; &lt;Scrolling AllowScroll="True" UseStaticHeaders="True" /&gt; &lt;Resizing AllowColumnResize="True" ClipCellContentOnResize="true" EnableRealTimeResize="true" ResizeGridOnColumnResize="true" /&gt; &lt;/ClientSettings&gt; &lt;MasterTableView CommandItemDisplay="Top" ClientDataKeyNames="ei_pk" DataKeyNames="ei_pk,ei_eco_fk" AllowAutomaticInserts="True" GridLines="None" TableLayout="fixed" HeaderStyle-Wrap="false" ItemStyle-Wrap="false"&gt; &lt;CommandItemTemplate&gt; &lt;a href="#" onclick="return ShowAddForm();"&gt;&lt;asp:Image ID="AddItem" runat="server" ImageUrl="~/RadControls/Grid/Skins/Office2007/AddRecord.gif" AlternateText="Add Item" /&gt;&lt;asp:Label ID="lblAddItem" runat="server" Text="Add Item" /&gt;&lt;/a&gt; &lt;/CommandItemTemplate&gt; &lt;Columns&gt; &lt;telerik:GridTemplateColumn UniqueName="Edit" Visible="False" Resizable="false" Reorderable="false"&gt; &lt;ItemTemplate&gt; &lt;asp:HyperLink ID="EditLink" runat="server" Text="Edit" ImageUrl="../RadControls/Grid/Skins/Office2007/Edit.gif" /&gt; &lt;/ItemTemplate&gt; &lt;HeaderStyle Width="20" /&gt; &lt;ItemStyle HorizontalAlign="Center" /&gt; &lt;/telerik:GridTemplateColumn&gt; &lt;telerik:GridButtonColumn Resizable="false" Reorderable="false" ConfirmText="Are you sure you want to delete this item?" UniqueName="Delete" CommandName="Delete" Visible="False" ButtonType="ImageButton" ImageUrl="../RadControls/Grid/Skins/Office2007/Delete.gif"&gt; &lt;HeaderStyle Width="20"/&gt; &lt;ItemStyle HorizontalAlign="Center" /&gt; &lt;/telerik:GridButtonColumn&gt; &lt;telerik:GridBoundColumn HeaderText="Trade" DataField="ftr_description" UniqueName="ftr_description" /&gt; &lt;telerik:GridBoundColumn HeaderText="Cost Type" DataField="combined_itemType" UniqueName="combined_itemType" /&gt; &lt;telerik:GridBoundColumn HeaderText="Est. Type" DataField="etp_code" UniqueName="etp_code" /&gt; &lt;telerik:GridBoundColumn HeaderText="Item Code" DataField="combined_code" UniqueName="combined_code" /&gt; &lt;telerik:GridBoundColumn HeaderText="Quantity" DataField="ei_quantity" UniqueName="ei_quantity"&gt; &lt;HeaderStyle Width="50" HorizontalAlign="Center" /&gt; &lt;ItemStyle HorizontalAlign="Right" /&gt; &lt;/telerik:GridBoundColumn&gt; &lt;telerik:GridBoundColumn HeaderText="Unit Cost" DataField="ei_unitCostworking" UniqueName="ei_unitCostworking" &gt; &lt;HeaderStyle Width="75" HorizontalAlign="Center" /&gt; &lt;ItemStyle HorizontalAlign="Right" /&gt; &lt;/telerik:GridBoundColumn&gt; &lt;telerik:GridBoundColumn HeaderText="Total Cost" DataField="ei_extendedCostWorking" UniqueName="ei_extendedCostWorking" DataFormatString="{0:#0.00}"&gt; &lt;HeaderStyle Width="80" HorizontalAlign="Center" /&gt; &lt;ItemStyle HorizontalAlign="Right" /&gt; &lt;/telerik:GridBoundColumn&gt; &lt;telerik:GridBoundColumn HeaderText="Budget" DataField="ei_budgetworking" UniqueName="ei_budgetworking"&gt; &lt;HeaderStyle Width="80" HorizontalAlign="Center" /&gt; &lt;ItemStyle HorizontalAlign="Right" /&gt; &lt;/telerik:GridBoundColumn&gt; &lt;telerik:GridHyperLinkColumn HeaderText="Change Order" DataTextField="eco_number" UniqueName="eco_number" DataNavigateUrlFields="eco_number" SortExpression="eco_number"&gt; &lt;HeaderStyle Width="104" /&gt; &lt;/telerik:GridHyperLinkColumn&gt; &lt;/Columns&gt; &lt;/MasterTableView&gt; &lt;/telerik:RadGrid&gt; </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload