html - Bootstrap 对齐 h2 和 Accordion

Question

我在右侧有一个侧边栏，它使用 Bootstrap 网格的 3 个元素。我试图让内容始终位于此侧边栏的右侧(因此它们必须始终占据 9)。我目前有一个 Accordion 和一个 h2，但是我很难将它们与页面上的其余内容左对齐。侧边栏编码如下:

<div class="col-md-3">
            <div class="list-group">
                <a href="example.html" class="list-group-item active">example</a>
            </div>
        </div>

每个“content div”如下(正确对齐)

    <div class="col-md-9 pull-right">
        <div class="panel panel-default">
             <div class="panel-heading">
                 <h4>title</h4>
             </div>
             <div class="panel-body">
                  <p>content</p>
             </div>
        </div>
   </div>

这是没有与内容正确对齐的 h2 和 Accordion 。

<div class="col-md-9 pull-right">
      <div class="row">
          <div class="col-md-12">
                 <h2 class="page-header col-md-9 pull-left">Action Strategies: What We Can Do Now</h2>
          </div>
       </div>

<div class="panel-group" id="accordion">
        <div class="panel panel-default">
            <div class="panel-heading together">
                <h4 class="panel-title">
                    <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapseOne">What We Can Do Together</a>
                </h4>
            </div>
            <div id="collapseOne" class="panel-collapse collapse">
                <div class="panel-body">
                  <ul>
                    <li>list</li>
                  </ul>
                </div>
            </div>
        </div>

帮助可视化问题的图像

没有右拉

Answer 1

从类列表中删除pull-right:

<div class="col-md-9 pull-right">
<!-------------------^^^^^^^^^^ This is the culprit to pull it to the right.

pull-right 类只是将 float: right !important; 添加到样式中，使内容向右推送。