Question

我希望能够使用右拉类在按钮下方放置文本。我还在文本的段落标记中放置了一个右拉类。

我的HTML代码：

<div class="box">
  <button type="submit"class="btn btn-info pull-right">Button</button>
  <p class="pull-right">Text</p>            
</div>

问题是文本显示在按钮旁边，而不是下方。我希望按钮底部的文字位于右侧。我该怎么做呢？

提前感谢您的建议。

Answer 1

将<button>...</button>置于段落内并添加一个中断应该可以解决问题。

像：

<div class="box">
  <p class="pull-right">
    <button type="submit"class="btn btn-info">Button</button><br />
  Text</p>            
</div>

Answer 2

如果你想在盒子div上添加右拉类，如果你只想在盒子div上向右浮动这两个元素。

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" />
  <div class="box pull-right">
  <button type="submit"class="btn btn-info">Button</button>
    <p class="below-btn-txt">Text</p>       
</div>

Answer 3

你需要清除浮动。以样式

创建类clearClass

.clearClass{ clear: both; }

并在段落中添加新类。

Bootstrap 3右拉按钮和文本

3 个答案: