Question

我正在寻找一种直接的css解决方案，它将强制标签与asp中的控件对齐。例如：

<asp:Label runat="server" AssociatedControlID="cboBox" Text="Control Label" />
<asp:DropDownList runat="server" ID="cboBox" />

会出现类似的情况：

Control Label
[[[[[]]]]]]]]]]]]V

有什么想法吗？

Answer 1

将它们包裹在span或div中：

<span class="field">
    <asp:Label runat="server" AssociatedControlID="cboBox" Text="Control Label" />
    <asp:DropDownList runat="server" ID="cboBox" />
</span>

然后：

.field label,
.field select
{
    display: inline-block;
    vertical-align: top;

    /* achieves same as inline-block for IE7 */
    *display: inline;
    *zoom: 1;
}

Answer 2

您可以尝试将它们放入容器中，并为该容器中的跨距应用特定样式。下面的示例可能需要稍微调整，但它应该指向正确的方向：

div.container span {
    display: table-cell;
    vertical-align: top;
}
div.container input {
    display: table-cell;
    vertical-align:middle;
}

然后在页面上：

<div class="container">
    <asp:Label runat="server" AssociatedControlID="cboBox" Text="Control Label" />
    <asp:DropDownList runat="server" ID="cboBox" />    
</div>

是否有一种可靠的方法将标签与控件对齐？

2 个答案: