html - 我们怎样才能使固定左侧导航栏旁边的容器响应？

Question

我正在尝试实现一个 UI，其中 LHS 上的导航栏是固定的，内容窗口是响应式的。以下是我的实现:

<div style="width: 15%; float: left; display: inline;>
  <nav class="navbar navbar-inverse navbar-left" style="">
    NAVIGATION CONTENT HERE (FIXED)
  </nav>
 </div>
 <div style="width: 85%; float: right; display: inline;">
    DESIRED RESPONSIVE CONTENT HERE
 </div>

如何实现？

我尝试通过在顶部添加一个容器并向两个 div 添加列类来使用 Bootstrap 类。当浏览器窗口尺寸缩小时，右侧的 div 与导航栏 div 重叠。

Answer 1

您确定要实现这样的设计吗？固定宽度的左侧边栏和可变宽度的内容？只使用引导表网格系统会更容易和更快。更不用说它会自动在所有设备和分辨率上运行，而您的设计只对某些特定分辨率有意义。