Question

每次我都包含一个下拉菜单，我的CSS布局就搞乱了。有人可以向我解释为什么以及如何解决它？

这是我的代码：

            <asp:Label ID="projnamelbl" runat="server" CssClass="editlabels" Text="Project                  Name"></asp:Label>
        <asp:TextBox ID="projnametxt" runat="server"></asp:TextBox><br />

        <asp:Label ID="paymentlbl" runat="server" CssClass="editlabels" Text="Payment  Type:"></asp:Label>
        <asp:DropDownList ID="paymentype" runat="server">
        <asp:ListItem Text="Cash" Value="cash"></asp:ListItem>
        <asp:ListItem Text="Intallments" Value="installments"></asp:ListItem>
        </asp:DropDownList><br />

        <asp:Label ID="projsumlbl" CssClass="editlabels" runat="server" Text="Project  Sum:"></asp:Label>
        <asp:TextBox ID="projsumtxt" runat="server"></asp:TextBox><br />

CSS：

   .editlabels {
   float:left;
   width:150px;
   margin-right:0.2em;
   padding-top:0.4em;
   padding-left:20px;
   text-align:left;
   font-weight:bold;
   }

在下拉菜单之后出现的任何内容由于某种原因都会向右移动。

Answer 1

只有删除边距并填充内容才会自动落实到位。

Answer 2

您需要将position: relative放在主容器上，然后在任何子容器上使用position: absolute

为什么下拉菜单总是弄乱我的CSS布局？

2 个答案: