Question

是否可以在div标签内左对齐标签和右对齐按钮？我的标签完美对齐，我的按钮甚至没有关闭（甚至可能出现在div标签之外。有人可以协助吗？

<div id="PlaceHolder" runat="server" visible="false">
  <asp:Label runat="server" ID="lblDisplay" CssClass="BoldTextBlack"> </asp:Label>
  <asp:Button runat="server" ID="btnRollBack" CssClass="Buttons" style="float:right"
    Text="Roll Back Last Change" OnClick="btnRollBack_Click" Height="30px" Width="119px" /> 
</div>

经过额外的测试后，似乎添加style="float:right"会使对齐偏差

Answer 1

您可以使用绝对定位将标签和按钮放在所需的位置。您希望它们相对于您的#Placeholder div定位，因此您还需要在那里添加CSS。

向PlaceHolder添加position: relative;不应该改变div的外观，但是它会告诉浏览器将任何封闭的，绝对定位的元素放置在与THIS相关的位置，而不是另一个/页面中一个整体：

#PlaceHolder {
   position: relative;  
}

然后我们可以使用绝对定位将标签和按钮准确地放在我们想要的位置。我没有你的设计规格，所以我正在为实际测量做好准备：）

我们告诉标签将其左边缘从#PlaceHolder的左边缘精确定位10px，将其底边缘从#PlaceHolder的底边缘向上10px。

#lblDisplay {
    position: absolute;
    left: 10px;
    bottom: 10px;
}

现在我们告诉按钮将其右边缘从#PlaceHolder的右边缘精确定位10px，并将其底边缘从#PlaceHolder的底边缘向上10px。

#btnRollBack {
    position: absolute;
    right: 10px;
    bottom: 10px;
}

在Div标签内右对齐按钮

1 个答案: