如何使用Bootstrap制作响应式侧边栏而不填满整个屏幕？

Question

我正在尝试使用bootstrap-side-navbar的代码并构建在this demo之上。这几乎是我的需要，但我希望它不要在桌面上填满整个屏幕。

问题在于，当我将max-width添加到.container-fluid侧边栏列并且内容重叠时，请参阅屏幕截图：

这是一个好的，反应迅速的解决方案吗？

Answer 1

用容器替换容器流体并添加以下css

#content {
    position: relative;
    width: calc(100% - 120px);
    float: right;
} 

我正在通过css calc属性计算宽度，但仍然需要编写媒体查询来处理不同屏幕中的布局。