Question

我在这里创建了一个问题演示：http://jsfiddle.net/XwCBa/

此处的表格要求提供电子邮件和密码，下方是“记住我”复选框，以及“忘记密码”链接（按钮）。

以下是我的问题 - “忘记密码”链接在下方复选框。它希望它与复选框位于同一行，并且右对齐。

我一直在讨论这个问题，我似乎无法获得“忘记密码”链接，我需要它。有什么建议？

<div class="controls controls-row">
  <label class="checkbox span4"><input type="checkbox" id="inlineCheckbox1" value="option1"> Remember me for 2 weeks</label>
  <button type="button" class="btn-link span2">Forgot Password?</button>
</div>

Answer 1

您可以将按钮放在“复选框”标签内，然后在控件组上使用pull-right，就像这样......

<div class="control-group pull-right">
 <div class="controls controls-row">
    <label class="checkbox"> <input type="checkbox" id="inlineCheckbox1" value="option1"> Remember me for 2 weeks  <button type="button" class="btn-link">Forgot Password?</button></label>
 </div>                                 
</div>

http://jsfiddle.net/skelly/XwCBa/2/

Answer 2

啊，谢谢你，谢谢。实际上我通过将右拉动向右移动到“忘记密码”链接来修改你的代码，这样他们两者都可以对齐它们。但这基本上就是答案，将它们都放在标签上。

<div class="control-group">
    <div class="controls controls-row">
        <label class="checkbox"> <input type="checkbox" id="inlineCheckbox1" value="option1"> Remember me for 2 weeks  <button type="button" class="btn-link pull-right">Forgot Password?</button></label>
    </div>  
</div>

在引导程序对话框中对齐表单元素

2 个答案: