CSS：x滚动限制

Question

这是我的代码，

#mainDiv {
    margin-top: 10px;
    position: relative;
}

#leftPanel {
    bottom: 0;
    overflow: scroll;
    padding-bottom: 120px;
   padding-left: 20px;
    position: fixed;
    top: 50px;
    width: 350px;
}``


#rightPanel {
    margin-left: 390px;
    width: 500px;
}

正如maindiv内部的名字所示，我放置了左右面板。左侧面板具有无序的href列表，右侧面板显示有关左侧单击链接的详细信息。

现在的问题是，当我向右侧面板滚动时，内容与左侧面板的内容重叠（因为右侧面板的左边距为390px;）。如何限制x-scroll？ 提前致谢

Answer 1

在#right panel中，添加overflow-x:scroll

请检查reference to overflow-x以获取更多选择。 当它溢出到块的外侧时，溢出被设置为可见，这是溢出属性的默认值。