Question

我已经制作了一个gridview，我需要精确的列宽比。这是我的代码：

<asp:GridView runat="server" ID="table" DataSourceID="Data" AutoGenerateColumns="false" AlternatingRowStyle-BackColor="LightGray" ShowHeader="false" 
                            DataKeyNames="ID" Width="100%" style="table-layout: fixed;" >

                            <Columns>

                                <asp:BoundField DataField="date" ItemStyle-Width="5%" ItemStyle-HorizontalAlign="Center" />
                                <asp:BoundField DataField="beltStatus" ItemStyle-Width="10%" ItemStyle-HorizontalAlign="Center" />
                                <asp:BoundField DataField="numberOfBelts" ItemStyle-Width="5%" ItemStyle-HorizontalAlign="Center" />
                                <asp:BoundField DataField="returnDate" ItemStyle-Width="10%" ItemStyle-HorizontalAlign="Center" />
                                <asp:BoundField DataField="prepaidAmount" ItemStyle-Width="10%" ItemStyle-HorizontalAlign="Center" />
                                <asp:BoundField DataField="checkNumber" ItemStyle-Width="5%" ItemStyle-HorizontalAlign="Center"/>
                                <asp:BoundField DataField="notes" ItemStyle-Width="10%" ItemStyle-CssClass="fixedWidth" />
                                <asp:BoundField DataField="numberOfModsFiveStar" ItemStyle-Width="5%"  ItemStyle-HorizontalAlign="Center" />
                                <asp:BoundField DataField="numberOfModsCanada" ItemStyle-Width="5%" ItemStyle-HorizontalAlign="Center" />
                                <asp:BoundField DataField="numberOfBuckles" ItemStyle-Width="5%" ItemStyle-HorizontalAlign="Center" />
                                <asp:BoundField DataField="numberOfBags" ItemStyle-Width="5%" ItemStyle-HorizontalAlign="Center" />
                                <asp:BoundField DataField="customerName" ItemStyle-Width="10%" ItemStyle-CssClass="fixedWidth" />
                                <asp:BoundField DataField="state" ItemStyle-Width="5%" ItemStyle-HorizontalAlign="Center"  />
                                <asp:BoundField DataField="email" ItemStyle-Width="5%" ItemStyle-HorizontalAlign="Center"  />

                                <asp:TemplateField ItemStyle-Width="5%">
                                    <ItemTemplate>
                                        <asp:HyperLink runat="server" NavigateUrl='<%# ConfigurationManager.AppSettings["historyLog"] + "?table=mos&id=" + Eval("ID") %>' 
                                            Text='<%# Eval("lastChangedByUser") + " - " + Eval("lastChangeTime") %>' ></asp:HyperLink>
                                    </ItemTemplate>
                                </asp:TemplateField>
                            </Columns>
                        </asp:GridView>

固定宽度css：

.fixedWidth
{
word-wrap: break-word;
word-break: break-all;
}

客户名称几乎总是比列宽更长。我希望文本下拉到下一行。相反，它做到了这一点：

有人可以帮忙吗？

Answer 1

您可能在其他地方使用CSS指定了white-space: nowrap。尝试将white-space: normal添加到您的fixedWidth CSS类。如果这不起作用，请打开Chrome右键单击表格单元格，然后说出＆＃34;检查元素＆＃34;。这将打开Chrome开发工具，并将有一个＆＃34;样式＆＃34;选项卡，将显示如何应用样式。您还可以动态更改Chrome开发工具中的样式值，并检查结果。

网格视图列不会自动换行

1 个答案: