Gridview Max Width（具有动态列大小）答案

【问题标题】：GridvIew Max Width (with dynamic column size)Gridview Max Width（具有动态列大小）
【发布时间】：2015-10-29 20:40:44
【问题描述】：

我已经进行了相当多的研究，我看到的一切最终都是人们谈论在 gridview 中设置列宽或尝试应用一个永远不会工作的类，除非你将宽度扩展到超过内部的数据它 - 这意味着您似乎不能简单地将渲染表的大小缩小到小于其中数据大小的任何值。

给定以下 GridView 代码：

<asp:GridView
    ItemStyle-CssClass="Item"
    ID="MainGrid"
    CssClass="DistDataGrid"
    CellPadding="3"
    runat="server"
    AutoGenerateColumns="False"
    Width="100%"
    HeaderStyle-CssClass="Header"
    RowStyle-CssClass="Item"
    AlternatingRowStyle-CssClass="AltItem"
    AllowSorting="True"
    AllowPaging="False"
    DataKeyNames="id">
    ...

我们看到我特别指出渲染表格的大小应该绝对是容器的大小（在本例中为 1800 像素），但渲染表格最终的宽度为 2545 像素，因为它包含的数据.

有没有办法强制渲染的表格正好是容纳它的容器的宽度（最大宽度），而不是在没有指定的情况下扩展到它包含的数据各个列的宽度？

请注意，设置width: 100% 或max-width: XXX pixels 不会起作用...

【问题讨论】：

我知道您尝试使用width:100%... 将使用width:100%; box-sizing:border-box; 完成工作（网格的css）？当然，从<asp:GridView ... 中删除width

标签： html css asp.net gridview

【解决方案1】：

这可能取决于您尝试放入表中的数据类型，但假设您正在存储文本，我可以使用 GridView：

<asp:GridView ID="GridView1" runat="server" AllowPaging="True" AutoGenerateColumns="False" DataKeyNames="ProductID" DataSourceID="SqlDataSource2" Width="800">
            <Columns>
                <asp:BoundField DataField="ProductID" HeaderText="Product ID" ReadOnly="True" SortExpression="ProductID"/>
                <asp:BoundField DataField="ProductName" HeaderText="Product Name" SortExpression="ProductName" />
                <asp:BoundField DataField="Quantity" HeaderText="Quantity" SortExpression="Quantity" />
                <asp:BoundField DataField="Price" HeaderText="Price" SortExpression="Price" />
                <asp:BoundField DataField="DateCreated" HeaderText="Date Created" SortExpression="DateCreated" />
                <asp:BoundField DataField="CreatedBy" HeaderText="Created By" SortExpression="CreatedBy" />
            </Columns>
        </asp:GridView>

在这种情况下，我只是将“宽度”属性设置为一个值，而不是最大宽度。

您还可以尝试确保为数据最大的列启用换行：

<asp:BoundField>
    <ItemStyle Wrap="True" />

【讨论】：