为页面创建滚动条，而不是div

Question

使用引导程序4，我创建了一个带有侧面导航菜单的页面。页面右侧底部有一张非常宽的桌子。我可以使用

创建div滚动条

overflow: scroll;

但是，当表包含100行时，用户将必须向下滚动一整天才能访问滚动条。有没有一种方法可以在浏览器窗口的底部创建滚动条，使其始终可用？示例代码在这里：https://jsfiddle.net/calnastic/0ncsofa6/4/

请加宽示例中的页面，以便可以显示导航菜单。

谢谢。

Answer 1

这里是我的建议，您可以根据自己的要求固定高度，然后让项目大于或等于100，最终数据溢出，并且由于固定了[ C0]。仅当行的数据增加（即宽度）时，才能看到水平滚动，并且可以在网站中看到滚动而不是滚动到底部。

我只是分享了一个例子，希望能对您有所帮助（在height中查看清晰的图片：

Full Screen

#MainDiv {
  height: 500px;
  width: 1000px;
  display: flex;
  flex-direction: row;
}

#leftMenu {
  height: 300px;
  width: 200px;
  border: 1px solid black;
}

#rightContent {
  height: 300px;
  /*fix your height here based on your website height*/
  width: 690px;
  border: 1px solid red;
  overflow: scroll;
  /*you can see the scroll only the width reaches its                          limit(690px in our case */
}

table {
  width: 690px;
}

td {
  width: 1000px;
  border: 1px solid black;
}