在Twitter引导程序中对齐可折叠按钮

Question

我在同一条线上做了2个按钮。第二个是可折叠按钮，它在视图中添加了一行2个按钮。这一切都很好。

然而，新折叠的按钮行与第二个按钮对齐。我希望它能在新崩溃的线上重新对齐它。怎么可能？

<div class="span5 offset4">
    <button class="btn-primary btn-large btn-bank" type="button"
        style="width: 100%;">Big Button </button>
</div>

<div id="collapsabilebutton">
    <a href="#show" data-toggle="collapse"><button
    class="btn btn-large">
    Button just next to Big button . Click it to expand a new row of buttons . 
    </button></a>
</div>

<div id="show" class="collapse">
    <button class="btn btn-small">hi</button>
    <button class="btn btn-small">hi</button>
</div>

我的需求：我不希望新行与其上方的小按钮对齐。实际上我希望它与Big按钮对齐。

有什么想法吗？

编辑1： Bootstrap版本2.3

编辑2：添加了图片，因为它很难完全重新创建小提琴。

我想将Hi按钮放在Click Me按钮的正下方，但是将其与Big Button对齐。

**EDIT 3 ( Answer )** 

事实上，解决方案非常简单。可折叠按钮应放置在必须对齐的父级的div标签内！因此将代码更改为以下内容并且可以正常工作：

   <div class="row">
    <div class="span5 offset4">
        <button class="btn-primary btn-large btn-primary" type="button"
            style="width: 100%;">Large Button</button>
            <div id="show" class="collapse">
                <button class="btn btn-small">hi</button>
                <button class="btn btn-small">hi</button>
            </div>
    </div>
    <div id="collapsabilebutton">
        <a href="#show" data-toggle="collapse"><button
            class="btn btn-large">Click</button></a>
    </div>
</div>

Answer 1

好的，我试图不要过多地影响你当前的代码，所以我只是添加了一个css修改：

div#show {
    width: 100%;
}

jsfiddle：http://jsfiddle.net/cDyHz/4/