я могу установить ширину полей в моей сетке данных?

Question

как мне все сжать и сделать поля не такими широкими, чтобы они могли поместиться на странице без горизонтальной прокрутки?я добавил css в div, но поле все еще очень длинное, в то время как текст ссылки действительно переносится (в некоторых браузерах)

Я надеюсь, что .net способ заставить его работать во всех браузерах.

вот мой ужасный интерфейс моей сетки данных

вот мой определенный код asp.net:

<asp:GridView ID="gv" runat="server" CellPadding="4" Font-Names="Verdana" Font-Size="8pt"
    EnableModelValidation="True" ForeColor="#333333" GridLines="None" OnRowCommand="gv_RowCommand"
    OnRowEditing="gv_RowEditing" OnRowCancelingEdit="gv_RowCancelingEdit" OnRowDataBound="gv_RowDataBound"
    OnRowDeleting="gv_RowDeleting" OnRowUpdating="gv_RowUpdating" ShowFooter="true"
    DataKeyNames="ProjectLinkId,LastUpdate" AutoGenerateColumns="False">
    <AlternatingRowStyle BackColor="White" />
    <RowStyle BackColor="#EFF3FB" />
    <Columns>
        <asp:TemplateField>
            <ItemTemplate>
                <table>
                    <tr>
                        <td>
                            <asp:Button runat="server" ID="cbEdit" Text="Edit" Width="75px" Font-Size="8pt" CommandName="Edit" />
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Button runat="server" ID="cbDelete" Text="Delete" Width="75px" Font-Size="8pt"
                                CommandName="Delete" />
                        </td>
                    </tr>
                </table>
            </ItemTemplate>
            <EditItemTemplate>
                <table>
                    <tr>
                        <td>
                            <asp:Button runat="server" ID="cbUpdate" Text="Update" Width="75px" Font-Size="8pt"
                                CommandName="Update" />
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Button runat="server" ID="cbCancel" Text="Cancel" Width="75px" Font-Size="8pt"
                                CommandName="Cancel" />
                        </td>
                    </tr>
                </table>
            </EditItemTemplate>
            <FooterTemplate>
                <asp:Button runat="server" ID="cbSave" Text="Insert" Width="75px" Font-Size="8pt"
                    CommandName="Save" />
            </FooterTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Type">
            <ItemTemplate>
                <asp:Label runat="server" ID="lblLinkTypeText" Text='<%# Bind("LinkTypeText") %>'
                    CssClass="DefaultFont" />
            </ItemTemplate>
            <EditItemTemplate>
                <asp:DropDownList runat="server" ID="ddlLinkTypeCID" CssClass="DefaultFont" />
            </EditItemTemplate>
            <FooterTemplate>
                <asp:DropDownList runat="server" ID="ftrLinkTypeCID" CssClass="DefaultFont" />
            </FooterTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="URL">
            <ItemTemplate>
                <div style="width:316px; word-wrap: break-word">
                    <asp:HyperLink runat="server" ID="lbURL" NavigateUrl='<%# Bind("URL") %>' Text='<%# Bind("URL") %>' Width="300" />
                </div>   
            </ItemTemplate>
            <EditItemTemplate>
                <asp:TextBox runat="server" ID="txtURL" TextMode="MultiLine" Text='<%# Bind("URL") %>'
                    CssClass="DefaultTextBox" />
            </EditItemTemplate>
            <FooterTemplate>
                <asp:TextBox runat="server" ID="ftrURL" TextMode="MultiLine" Text='<%# Bind("URL") %>'
                    CssClass="DefaultTextBox" />
            </FooterTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Description">
            <ItemTemplate>
                <div style="width:316px; word-wrap: break-word">
                    <asp:Label runat="server" ID="lblDescription" Text='<%# Bind("Description") %>' CssClass="DefaultFont"/>
                </div>
            </ItemTemplate>
            <EditItemTemplate>
                <asp:TextBox runat="server" ID="txtDescription" TextMode="MultiLine" Text='<%# Bind("Description") %>'
                    CssClass="DefaultTextBox" />
            </EditItemTemplate>
            <FooterTemplate>
                <asp:TextBox runat="server" ID="ftrDescription" TextMode="MultiLine" Text='<%# Bind("Description") %>'
                    CssClass="DefaultTextBox" />
            </FooterTemplate>
        </asp:TemplateField>
    </Columns>
    <FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
    <PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
    <SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
    <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
    <EditRowStyle BackColor="#2461BF" />
    <AlternatingRowStyle BackColor="White" />
</asp:GridView>

Answer 1

Вы можете добавить элемент ItemStyle к вашему TemplateField

Пример:

<asp:TemplateField>
    <ItemStyle Width="45%" />
    <ItemTemplate>
        ...
    </ItemTemplate>
</asp:TemplateField>

Answer 2

Вот еще один вариант

<asp:TemplateField>
    <ItemStyle CssClass="styled-column"></ItemStyle>
    <ItemTemplate>
       ...
    </ItemTemplate>
</asp:TemplateField>

css:

.styled-column {
    width: 300px;
}

отображается как:

<td class="styled-column">
      ...          
</td>

Answer 3

Почему бы вам не поместить класс CSS и управлять шириной из файла CSS?

/ ** РЕДАКТИРОВАТЬ ** /

вы можете сделать это встроенным или поместить класс сcssClass = "nameofcolumn", а затем в файле CSS:

.nameofcolumn {width: 400px;}

Надеюсь, это поможет!

Answer 4

Попробуйте изменить ширину в ItemTemplate для столбца URL, так как это кажется проблемой.Попробуйте что-то вроде 100px вместо 316

В частности, здесь:

<ItemTemplate>
   <div style="width:316px; word-wrap: break-word">
   <asp:HyperLink runat="server" ID="lbURL" NavigateUrl='<%# Bind("URL") %>' Text='<%#Bind("URL") %>' Width="300" />
   </div>   
 </ItemTemplate>