将 TextBox 垂直对齐到 GridView 行的中心

Question

我有一个 GridView，里面有几个字段，下面是它的代码：

<asp:GridView ID="GW" runat="server" AutoGenerateColumns="False" CellPadding="0" ForeColor="#333333" GridLines="None" Width="100%" OnRowDataBound="GW_RowDataBound">
                            <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
                            <Columns>
                                <asp:BoundField DataField="df1" HeaderText="" HeaderStyle-HorizontalAlign="Center" DataFormatString="{0:d}" HeaderStyle-CssClass="hideGridColumn" ItemStyle-CssClass="hideGridColumn">
                                    <HeaderStyle HorizontalAlign="Center" VerticalAlign="Middle" />
                                    <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
                                </asp:BoundField>
                                <asp:BoundField DataField="df2" HeaderText="" HeaderStyle-HorizontalAlign="Center" DataFormatString="{0:d}" HeaderStyle-CssClass="hideGridColumn" ItemStyle-CssClass="hideGridColumn">
                                    <HeaderStyle HorizontalAlign="Center" VerticalAlign="Middle" />
                                    <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
                                </asp:BoundField>
                                <asp:BoundField DataField="df3" HeaderText="Activity" HeaderStyle-HorizontalAlign="Center" DataFormatString="{0:d}">
                                    <HeaderStyle HorizontalAlign="Center" VerticalAlign="Middle" />
                                    <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
                                </asp:BoundField>
                                <asp:TemplateField HeaderStyle-HorizontalAlign="Center" ItemStyle-HorizontalAlign="Center">
                                    <ItemTemplate>
                                        <asp:RadioButtonList ID="BlOption" RepeatDirection="Horizontal" OnSelectedIndexChanged="Rating_SelectedIndexChanged" AutoPostBack="true" runat="server" Width="50px" HeaderText="" RepeatLayout="Table">
                                            <asp:ListItem Value="0">0</asp:ListItem>
                                            <asp:ListItem Value="1">1</asp:ListItem>
                                            <asp:ListItem Value="2">2</asp:ListItem>
                                            <asp:ListItem Value="3">3</asp:ListItem>
                                            <asp:ListItem Value="4">4</asp:ListItem>
                                            <asp:ListItem Value="5">5</asp:ListItem>
                                        </asp:RadioButtonList>
                                    </ItemTemplate>
                                </asp:TemplateField>
                                <asp:TemplateField HeaderText="Comment" ItemStyle-VerticalAlign="Bottom">
                                    <ItemTemplate>
                                        <asp:TextBox ID="tbComment"  runat="server" AutoPostBack="true" OnTextChanged="Comment_SelectedIndexChanged" ></asp:TextBox>
                                    </ItemTemplate>
                                </asp:TemplateField>

                            </Columns>
                        </asp:GridView>

问题是TextBox tbComment，它粘在行的顶部。我尝试将 ItemStyle-VerticalAlign 属性设置为 Middle 或 Bottom，但 TextBox 卡在了行的顶部。

这是它的外观：

你能告诉我我做错了什么吗？ 谢谢！

Answer 1

这样试试：

<asp:TemplateField HeaderText="Comment" >
        <ItemTemplate>
            <asp:TextBox ID="tbComment"  runat="server" AutoPostBack="true" OnTextChanged="Comment_SelectedIndexChanged" ></asp:TextBox>
        </ItemTemplate>
           <ItemStyle  VerticalAlign="Bottom" />
</asp:TemplateField>

并检查页面中是否有可以与表格样式交互的 css 文件。尝试删除它。

我遇到了类似的问题，但是当我将 itemstyle 设置为如下时

<ItemStyle VerticalAlign="Bottom"  />

我解决了。

你可以像这样定义一个垂直对齐的样式

.mystyle
{vertical-align:bottom;}

并在需要时以这种方式使用

<asp:TemplateField HeaderText="Comment" >
        <ItemTemplate>
            <asp:TextBox ID="tbComment"  runat="server" AutoPostBack="true" OnTextChanged="Comment_SelectedIndexChanged" ></asp:TextBox>
        </ItemTemplate>
           <ItemStyle  CssClass="mystyle" />
</asp:TemplateField>