Javascript 如何垂直而非水平地固定div？

以下是我的设置：

<div id="header-container">
    <div id="header">
        this is the header part. i want to be able to scroll this one horizontally but not vertically
    </div>    
</div>

<div id="maincontent">
    here some text just to show that the div is scrolling vertically.
</div>

在CSS中，我将标题容器的位置设置为fixed，这样它就可以正常工作，并且不会垂直和水平滚动

但是我想要做的是垂直地修正header容器div，并能够水平地滚动它，这样当我调整窗口屏幕的大小时，我仍然可以通过滚动来读取header div的全部内容

---

提前谢谢！这是一个

我认为使标题可滚动没有任何美学或设计价值。更好的方法是调整页眉内容的大小，或者在浏览器空间占用较大时删除部分页眉。媒体查询对此可能非常有用

如果仍然希望使标题内容可滚动，则可以将overflow-x:auto声明添加到标题容器中。当水平空间不足时，滚动条将弹出，用户将能够水平滚动。但是，就像我说的，这不是最好的设计

---

关于代码的一些注释。首先，收割台的高度可以是100%。这样，您只需要调整标题容器的大小，其标题子容器将相应地缩放。其次，应使用绝对定位来精确放置元素。在您的情况下，position:absolute和left:40px声明可以替换为一个margin left:40px，这要经济得多。

更明智的想法是将标题设置为动态宽度，这样就不需要水平滚动。但是，如果您决定使用javascript来修复它，您必须使用绝对定位，更改window.onscroll上的顶部位置，然后使页面的宽度与页眉一样宽，因为它是绝对定位的，所以不会自动调整detected@Twish不知道你想要什么。。请解释清楚