html - 在段落和链接上使用 Bootstrap 中的 clearfix

Question

我尝试清除段落中的 float 链接。我将 clearfix 设置为包含 float 元素和普通元素的根 div。

<div class="container clearfix">
  <div class="row">
    <div class="col-md-12">
      <h2>Accountoverview</h2>
      <hr>
    </div>
  </div>
  <div class="row">
    <div class="col-md-12">
      <p>
        <a href="#" class="btn btn-success pull-right">
         <span class="glyphicon glyphicon-plus"></span> 
          Test
        </a>
      </p>
    </div>
  </div>
  <div class="row">
    <div class="col-md-12">
      <div class="table-responsive">
        <table class="table">
          <thead>
            <tr>
              <th>Username</th>
              <th>Email</th>
            </tr>
          </thead>
          <tbody>
          </tbody>
        </table>
      </div>
    </div>
  </div>
</div>

例子: http://jsfiddle.net/mnlfischer/gv98D/3/

在 800 像素的视口(viewport)大小上，链接(按钮)破坏了结构。

有办法解决吗？

全尺寸分辨率: http://jsfiddle.net/mnlfischer/gv98D/3/embedded/result/

Answer 1

我向父 p 标签添加了一个 clearfix。 fiddle :http://jsfiddle.net/8aGC6/

<div class="row">
 <div class="col-md-12">
  <p class="clearfix">
    <a href="#" class="btn btn-success pull-right"><span class="glyphicon glyphicon-plus"></span> Test</a>
  </p>
 </div>
</div>