jquery - Bootstrap 问题。为什么我的右侧面板没有填满整个空间

Question

我使用 Bootstrap CSS 开发了一个小型 UI。我远不是专家。不幸的是，我的右面板有问题。

我已经在 J​​sfiddle 上推送了我的代码 -> https://jsfiddle.net/camsellem/e4dddfw3/

    <div class="col-xs-3 col-lg-3">
        <div class="panel panel-info" style="position:fixed;">
            <div class="panel-heading">Suggested products</div>
            <div class="panel-body">
                <div id="products-suggest" class="list-group"></div>
            </div>
        </div>
    </div>

这并不明显，因为我们无法全屏打开它，但实际上名为“建议产品”的右侧面板从未填满整个空间。面板末端和容器末端之间总是有一个空白间隙。我尝试了不同的布局但没有成功。在这张截图上更明显。

感谢任何帮助。

干杯

Answer 1

在这个类中添加这个CSS

.panel.panel-info {
    width: 23%;
}

https://jsfiddle.net/e4dddfw3/3/