0

我创建了一个具有固定导航栏和固定侧边栏的 Bootstrap 布局，以便剩余的跨度（内容跨度）将垂直滚动。但是我希望内容跨度实际上包含一个窗口标题和一个窗口 - 其中窗口标题是静态的，但窗口的内容在窗口内滚动。

.sidebar-nav-fixed {
  padding: 9px 0;
  position: fixed;
  left: 20px;
  top: 78px;
  width: 250px;
}

.row-fluid > .span-fixed-sidebar {
  margin-left: 290px;
}

.main {
  margin-top: 80px;
}

.header {
  margin-top: 80px;
}

.threadwindow {
  height:  100%;
  overflow: auto;
  border: 1px solid #333;
}

我在这里发布了当前代码http://jsfiddle.net/timburgess/CUGu8/

我会很感激任何建议。我尝试了一个固定位置的窗口标题，但窗口内容只是在它上面滚动:-(这不是我想要的。

4

1 回答 1

1

我已经解决了这个问题，核心 css 本质上是：

#main {
  position: absolute;
  left: 300px;
  top: 100px;
  right:  0;
  bottom: 0;
  border: 2px solid #333;
}


.threadwindow {
  position: absolute;
  left: 0;
  top: 50px;
  right: 0;  
  bottom: 0;
  border: 1px solid #333;
  overflow-y: auto;
}

完整的结果在：

http://jsfiddle.net/timburgess/ZTt5M/

为了清楚起见，我用边框包围了主窗口以强调它，并在其中嵌入了一个子窗口（同样带有边框），它允许在子窗口内容上放置标题。如果子窗口中的内容溢出可用空间，它会垂直滚动，并且通过使用绝对定位，主窗口的右边框和下边框被固定到浏览器的边缘。

于 2012-12-05T10:28:52.387 回答