将按钮和文本置于第二个按钮右侧但不居中

时间:2014-07-07 22:50:59

标签: html css asp.net

我有一个弹出窗口,其中有一个多行文本框,下面有两个按钮。取消和保存。

我有:

<div style="width: 650px;">
    <div style="padding-top: 10px; text-align: center">
        <asp:TextBox ID="TxtTest" Width="530px" TextMode="MultiLine" Style="word-wrap: break-word; height: 200px; overflow: auto; vertical-align: top" runat="server" AutoComplete="off" />
        <asp:TextBoxWatermarkExtender ID="TextBoxWatermarkExtender2" WatermarkCssClass="textwatermarkNotes" TargetControlID="TxtOther" WatermarkText="Please enter a message here..." runat="server" />
    </div>
    <div style="margin-top: 10px; margin-bottom: 10px; text-align: center;">
        <asp:Button ID="BtnCancel" OnClick="btnCancel_click" CssClass="buttonSmall" CausesValidation="false" Text="Cancel" runat="server" OnClientClick="EncodeText()" />&nbsp;&nbsp;
        <asp:Button ID="BtnSave" runat="server" CssClass="buttonSmall" Text="Save" OnClick="btnSave_Click" />
    </div>
    <div>
        <asp:Label Width="130px" ID="txtCharMax" Text="" runat="server" />
    </div>
</div>

我在代码隐藏中说“100 max character”。但是我希望取消和保存居中,并且“保存”右侧的“最多100个字符”。

在第4次DIV我认为我可以做类似的事情:

<div style="float:left">
    <asp:Label Width="130px" ID="txtCharMax" Text="">
</div> 

但那没用。

最好/最简单的方法是什么?离开CSS但使用Style标签?

1 个答案:

答案 0 :(得分:0)

尝试这样的事情:

<div style="text-align: center;">
          <button style="margin-left:100px">cancel</button>&nbsp;&nbsp;
            <button>save</button>
        <span style="display:inline-block;width:100px;">
            TEXT
        </span>
</div>

使文本内联块允许它与按钮对齐。然后给它一个宽度允许我们在左侧按钮上使用margin-left来向右分流相同的量,以便按钮显示在中央。