这是我的HTML代码:
假设浏览器窗口宽度为500像素,我希望header-wrapper也是500像素宽,并带有颜色背景,title应水平居中在这个500像素内。而some-wide-content是一个宽度为1000像素的大表格。由于这个大表格,页面的主体宽度大于浏览器窗口,所以用户可以横向滚动该页面。但当他们横向滚动时,我不想header-wrapper移动,我不能将header-wrapper设置为
那么,如何创建一个元素,在页面主体水平滚动时不会水平滚动?
编辑: 我的当前解决方案是仅使some-wide-content可滚动,因此当用户水平滚动时,他们不会滚动整个页面。但我不能使用此解决方案,因为出于某些原因,我想横向滚动整个页面。
这是我的HTML代码:
<div class='header-wrapper'>
<div class='title'>Title</div>
</div>
<div class='some-wide-content'>
</div>
假设浏览器窗口宽度为500像素,我希望header-wrapper也是500像素宽,并带有颜色背景,title应水平居中在这个500像素内。而some-wide-content是一个宽度为1000像素的大表格。由于这个大表格,页面的主体宽度大于浏览器窗口,所以用户可以横向滚动该页面。但当他们横向滚动时,我不想header-wrapper移动,我不能将header-wrapper设置为
position: fixed
,因为它应该随页面垂直移动。那么,如何创建一个元素,在页面主体水平滚动时不会水平滚动?
编辑: 我的当前解决方案是仅使some-wide-content可滚动,因此当用户水平滚动时,他们不会滚动整个页面。但我不能使用此解决方案,因为出于某些原因,我想横向滚动整个页面。