My page looks correct in Firefox and IE8. But in IE7, a nested gridview spills into the adjacent cell, much like the issue here.
Looking at it in the developer tools, there is an inline-style associated with the table that ASP.NET generated, and it has a width attribute of 100%. If I remove this, the nested table pops back where it belongs.
Problem is, nowhere is an inline-style set. In fact, if I try to set width='250px'
, it gets overridden with width='100%'
. If I try to remove the width attribute in the code-behind, attrGridView.Attributes["Width"]
is null, and calling .Remove()
does nothing. But every asp.net-generated gridview-table has an inline style with width='100%'
set on it (it's only causing me issues in one place).
Setting table-layout='fixed'
, as suggested in the article I linked to, did not help.
How do I get ASP.NET to stop setting this property?
Some code:
<asp:TemplateField HeaderText="Attributes" SortExpression="Attributes">
<HeaderStyle CssClass="GridHeaderCell" />
<ItemStyle CssClass="GridTableCell AttrGridCellPadding" />
<ItemTemplate>
<asp:GridView id="attributesGridView" runat="server"
AutoGenerateColumns="false" ShowHeader="false" GridLines="None"
AlternatingRowStyle-BackColor="White" CssClass="StupidGridView" >
<EmptyDataTemplate>
<p class="italic">There are no attributes for this request.</p>
</EmptyDataTemplate>
<Columns>
<asp:TemplateField>
<ItemStyle CssClass="AttrTableCell" />
<ItemTemplate>
<asp:Label id="attributeName" runat="server"
Text='<%# Eval("Name") + ": "+ Eval("Value") %>'
CssClass="AttrGridCell"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</ItemTemplate>
</asp:TemplateField>
.StupidGridView {
width: 250px;
}
Themes are being applied and overriding control-level settings. Check theme settings on page, web.config, or anywhere else a theme may be set.