Bootstrap填充容器 - 流体与按钮到页脚

Question

我确实有以下小布局：

https://gyazo.com/37ca69d600aebc339c29fba14a52d911

<div class="container-fluid">
    <div class="row" style="">
        <div class="col-xs-12">
            <div class="btn-group btn-group-justified" role="group" aria-label="...">
                <div class="btn-group" role="group">
                    <button type="button" class="btn btn-default btn-lg">Left</button>
                </div>
                <div class="btn-group" role="group">
                    <button type="button" class="btn btn-default btn-lg">Left</button>
                </div>
            </div>
        </div>
    </div>
    <div class="row" style="">
        <div class="col-xs-12">
            <div class="btn-group btn-group-justified" role="group" aria-label="...">
                <div class="btn-group" role="group">
                    <button type="button" class="btn btn-default btn-lg">Left</button>
                </div>
                <div class="btn-group" role="group">
                    <button type="button" class="btn btn-default btn-lg">Left</button>
                </div>
            </div>
        </div>
    </div>
    <div class="row" style="">
        <div class="col-xs-12">
            <div class="btn-group btn-group-justified" role="group" aria-label="...">
                <div class="btn-group" role="group">
                    <button type="button" class="btn btn-default btn-lg">Left</button>
                </div>
                <div class="btn-group" role="group">
                    <button type="button" class="btn btn-default btn-lg">Left</button>
                </div>
            </div>
        </div>
    </div>
    <div class="row" style="">
        <div class="col-xs-12">
            <div class="btn-group btn-group-justified" role="group" aria-label="...">
                <div class="btn-group" role="group">
                    <button type="button" class="btn btn-default btn-lg">Left</button>
                </div>
                <div class="btn-group" role="group">
                    <button type="button" class="btn btn-default btn-lg">Left</button>
                </div>
            </div>
        </div>
    </div>
</div>
</div>
<div class="footer navbar-fixed-bottom">
    <center>
        <h1>footer is here</h1>
    </center>
</div>

我的问题是我如何使按钮按比例缩放，以便它根据屏幕尺寸适合从容器从标题到页脚的按钮。