Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/css/33.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Css webkit滚动条上的不同宽度_Css_Google Chrome_Webkit_Scrollbar_Overflow - Fatal编程技术网

Css webkit滚动条上的不同宽度

Css webkit滚动条上的不同宽度,css,google-chrome,webkit,scrollbar,overflow,Css,Google Chrome,Webkit,Scrollbar,Overflow,问题 我有两个带溢出滚动条的div。两者宽度相同。不过,它们的宽度不同 这是一个CSS问题,但我添加了一些JS。通过拖动底部滚动条可以影响顶部滚动条 我只希望它能与像Chrome这样的webkit浏览器一起工作 Jsfiddle: HTML <div class="mmt"> <div class="mmt-scrollbar"> <div></div> </div> <div class=

问题

我有两个带溢出滚动条的div。两者宽度相同。不过,它们的宽度不同

这是一个CSS问题,但我添加了一些JS。通过拖动底部滚动条可以影响顶部滚动条

我只希望它能与像Chrome这样的webkit浏览器一起工作

Jsfiddle:

HTML

<div class="mmt">
    <div class="mmt-scrollbar">
        <div></div>
    </div>
    <div class="mmt-cropped">
        <div>Content2</div>
    </div>
</div>
JS-不需要

只需将底部滚动条连接到顶部滚动条。这不是必需的,但它更容易发现问题

jQuery(window).load(function($) {
    $('.mmt-cropped').scroll(function(){
         $('.mmt-scrollbar').scrollLeft( $('.mmt-cropped').scrollLeft() );
    });
});

.mmt-scrollbar,
.mmt-scrollbar div {
    height: 100px;
}
css

您可以通过给()指定一些高度来找到滚动条


注意:
.mmt scrollbar div
右侧的垂直滚动条在给定一定高度后。

.mmt-scrollbar,
.mmt-scrollbar div {
    height: 11px;
    overflow-y:hidden; /* add this as there is a vertical scrollbar bar which is occupying some space */ 
}
.mmt-scrollbar,
.mmt-scrollbar div {
    height: 100px;
}