Bootstrap垂直网格，包含固定和对齐内容的混合

Question

我有一个看起来像这样的引导网格/行......

<!--column a-->
<div class="col-sm-3">
</div>

<!--column b-->
<div class="col-sm-6"> 

    <!-- I want this div to always be fixed at the top of column b and take up 15% of column b's height-->
    <div>
        <h1 id="mainText">
            Some main text
        </h1>
    </div>

    <!-- I want these 2 divs to be centered within the remaining 85% of column b's height-->
    <div>
        <p id="bodyText">
            Some body text
        </p>
    </div>
    <div>
        <h2 id="detailText">
            Some detail text
        </h2>
    </div>

</div>

<!--column c-->
<div class="col-sm-3">
</div>

我希望列b中的顶部div（包含h1元素＆＃34; mainText＆＃34;）始终固定在顶部 - 占据列的前15％。

然后我希望剩余的2个div（包含＆＃34; bodyText＆＃34;和＃34; detailText＆＃34;）在B列的剩余85％内垂直居中/展开。

我可以通过简单地添加＆＃34; margin：auto＆＃34;来实现col-sm-6中所有3个div的垂直中心效果。到col-sm-6（当然这意味着＆＃34; mainText＆＃34;可能会比B列的15％滑落）。所以我尝试在最后2个div中添加另一个div（使用＆＃34; margin：auto＆＃34;），但它根本没有效果。

有没有人对在引导列中修复一个div的这两个要求以及展开另外两个div的最佳方法有任何建议？真的很难想象出正确的结构方式，所以要欣赏任何想法。