GridView 列宽度 浏览器兼容问题

 1 <asp:GridView ID="gvFriendInvite" runat="server" EnableModelValidation="True" 
 2                CellPadding="4" ForeColor="#333333">
 3             <AlternatingRowStyle BackColor="White" />
 4             <Columns>
 5                
 6                 <asp:BoundField DataField="SendDateTime" HeaderText="邀请时间" >
 7                 <ItemStyle CssClass="lpadding" />
 8                 <HeaderStyle HorizontalAlign="Center" Width="160px" />
 9                 </asp:BoundField>
10                 <asp:BoundField DataField="InviteMail" HeaderText="被邀请人" >
11                 <HeaderStyle HorizontalAlign="Center" Width="200px"/>
12                 <ItemStyle  CssClass="lpadding"/>
13                 </asp:BoundField>
14 
15                 <asp:BoundField DataField="IsRegister" HeaderText="注册时间" >
16                 <HeaderStyle HorizontalAlign="Center" Width="80px"/>
17                 <ItemStyle HorizontalAlign="Center" />
18                 </asp:BoundField>
19                 <asp:BoundField DataField="RegisterName" HeaderText="注册会员" >
20                 <HeaderStyle HorizontalAlign="Center" Width="120px"/>
21                  <ItemStyle  CssClass="lpadding" />
22                 </asp:BoundField>
23                 <asp:BoundField DataField="IsFristLodging" HeaderText="首日入住" >
24                 <HeaderStyle HorizontalAlign="Center" Width="80px"/>
25                 <ItemStyle HorizontalAlign="Center"/>
26                 </asp:BoundField>
27                 <asp:BoundField DataField="IsLodgingECoupons" HeaderText="绑特价券" >
28                 <HeaderStyle HorizontalAlign="Center" Width="80px"/>
29                 <ItemStyle  HorizontalAlign="Center"/>
30                 </asp:BoundField>
31                 <asp:BoundField DataField="IsLodgingSendPoint" HeaderText="入住邀请人送积分" >
32                 <HeaderStyle HorizontalAlign="Center" Width="120px"/>
33                 <ItemStyle HorizontalAlign="Center"/>
34                 </asp:BoundField>
35                 <asp:BoundField DataField="Remark" HeaderText="备注" >
36                 <HeaderStyle HorizontalAlign="Center" Width="400px"/>
37                 <ItemStyle  CssClass="lpadding"/>
38                 </asp:BoundField>
39             </Columns>
40             <EditRowStyle BackColor="#2461BF" />
41             <FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
42             <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
43             <PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
44             <RowStyle BackColor="#EFF3FB" />
45             <SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
46         </asp:GridView>    
 

今天在使用GridView 的时候发现了如下的问题:在IE8,IE9 及Chrome 和firefox 中GridView 显示一切正常,但是在IE7中显示的却有点夸张。

后来才发现是GridView列宽度 设置的问题:

我们可以在ItemStyle中设置<ItemStyle CssClass="lpadding" Width="160px" />,
也可以在HeaderStyle中设置 <HeaderStyle HorizontalAlign="Center" Width="160px"/>。
在ItemStyle设置宽度后在IE8,IE9 及Chrome 和firefox 中 显示是没有问题一切正常的。
但是在IE7 中就显示的有点小问题了(不会按照你设置的宽度显示)。要解决这个问题其实很简单,即宽度在HeaderStyle 设置。

原文地址:https://www.cnblogs.com/baoconghui/p/2226364.html