全高边框？

Question

如何在不设置固定高度的情况下设置边框的完整高度？

<div class="col-md-9"></div>的内容非常大，在侧栏（<div class="col-md-3"> </div）上，红色边框应垂直展开。

参见示例：https://jsfiddle.net/DTcHh/38699/

HTML：

<div class="panel panel-default">
    <div class="panel-body">
        <div class="row">
            <div class="col-md-9">
                <p>Blah Blah Blah</p>
                <p>Blah Blah Blah</p>
                <p>Blah Blah Blah</p>
                <p>Blah Blah Blah</p>
            </div>
            <div class="col-md-3">
                <div class="border">
                    <p>Sidebar</p>
                </div>
            </div>
        </div>
    </div>
</div>

CSS：

.border {
    border-left: 1px solid red;
    padding-left: 5px;
}

Answer 1

为什么不将.border课程从.col-md-3切换为.col-md-9，并将border-left更改为border-right .border

.border {
  border-right: 1px solid red;
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<div class="panel panel-default">
  <div class="panel-body">
    <div class="row">
      <div class="col-md-9 col-xs-9">
        <div class="border">
          <p>Blah Blah Blah</p>
          <p>Blah Blah Blah</p>
          <p>Blah Blah Blah</p>
          <p>Blah Blah Blah</p>
        </div>
      </div>

      <div class="col-md-3 col-xs-3">
        <p>Sidebar</p>
      </div>
    </div>
  </div>
</div>