Javascript 输入范围在chrome中不起作用

我正在修复跨浏览器平台的CSS输入范围。 我找到了这个密码笔，它是：

当我在我的chrome浏览器中打开上面的链接时，它工作得很好

当我将相同的代码复制到JSFIDLE中时，它不起作用

我无法确定为什么会出现这个问题

我如何才能得到同样的输入滑块拇指，这是即将在Mozilla和IE浏览器以及

谢谢你的帮助

我的chrome版本：

Google Chrome是最新版本65.0.3325.181（官方版本） （64位）

---

问题在于

SCSS

代码。在fiddle版本中，它没有正确编译并显示错误

SCS中存在错误
。请看下图，其中显示了chrome developer tool中的错误


在Codepen中，上述SCSS代码已正确编译。如果我复制了SCSS的编译版本并将其粘贴到小提琴中，那么它就可以正常工作。检查


div{
高度：100px；
显示器：flex；
证明内容：中心；
}
输入{
对齐项目：居中；
-webkit外观：无；
-moz外观：无；
外观：无；
背景：无；
光标：指针；
显示器：flex；
身高：100%；
最小高度：50px；
溢出：隐藏；
宽度：240px；
}
输入：焦点{
盒影：无；
大纲：无；
}
输入：：-webkit滑块可运行轨迹{
背景#e33d44；
内容：''；
高度：2倍；
指针事件：无；
}
输入：：-webkit滑块拇指{
高度：18px；
宽度：28px；
-webkit外观：无；
外观：无；
背景：#fff；
边界半径：8px；
盒子阴影：5px0 0 0-8-8px0 0-8px（C7C7C7C7，6px 0 0-8px（C7C7C7C7C7，7px 0 0 0-8 px 0-8 px（C7C7C7C7C7，7px 0 0 0-8 px 0-8px（C7C7C7C7C7C7C7）C7，7C7C7，7px 0 0 0 0 0 0-8-8 px 0-8-8 px 0-8-8-8 px 0-8-8 px（C7C7，7C7C7，7C7C7C7，7C7，7C7C7，7C7，7C7，7C7，7C7，7C7，7C7，70-0-0-8 px 0-0-8 px 0-8 px 0-8 px 0-8#c7c7c7，14px 0-8px#c7c7c7，15px 0-8px#c7c7c7，16px 0-8px#c7c7c7，17px 0-8px#c7c7c7，18px 0-8px#c7c7c7，19px 0-8px#c7c7c77，21 PX0-0-8 PX0-8 PX（C7C7）C7C7，22 PX0-0-8 PX（C7C7）C7C7，22 PX0 0-8 PX0-8 PX（c7c7c7）C7，22 PX0-0-8 PX0-8 PX0-8 PX0-8 PX0-8 PX0-8 PX（C7C7）c7c7c7，C7C7C7C7C7C7，C7，7，22 PX0 0-0 0-0-0-0-0-0-8 PX0-0-8 PX0-0-8 PX0-8 PX0-8 PX0-8-8 PX0-8 PX0-8 PX0-8-8-8 PX0-8-8 PX0-8-8-8-8 PX（C7C7C7C7，C7，C7，C7，C7，C7，8-8-8-8-#c7c7c7，29PX0-8px#c7c7c7，30PX0-8px#c7c7c7，31PX0-8px#c7c7c7，32PX0-8px#c7c7c7，33PX0-8px#C7C7，34PX0-8px#c7c7c7，3C7C7、C7C7、C7C7、C7C7、C7C7、C7、37PX0-0-8 PX 0-8 PX（C7）C7、C7、C7、C7、C7、C7、C7、C7、C7、C7-C7、38PX0 0-0-8 PX0-8 PX0-8 PX0-8 PX0-8 PX0-8 PX0-8 PX（C7）C7C7、C7、C7、C7-C7、C7、C7、C7、C7-0-0-0-0-0-0-0-0-0-0-8 PX0-8-8-8 PX0-8 PX0-8 PX0-8-8 PX0-8-8-8 PX0-8-8-8 PX0-8 PX0-8 PX0-8 PX0-8-8-8-8 PX0-8 PX0-8-8-8-8 c7c7c7，44px0-8px#c7c7c7，45px0-8px#c7c7c7，46px0-8px#c7c7c7，47px0-8px#C7C7C7C7，48px0-8px#c7c7c7，49px0-8px#C7C7C7C7，50pxc7c7c7，52PX0 0-8 PX 0-8 PX0 0-8 PX 0-8 PX（C7C7）C7，52px 7，52PX0 0-8 PXC7C7，c7c7c7，53PX0 0 0-8 PXC7，C7C7，53PX0 0-0-8 PX0-8 PX0-8 PX0-8 PX0-8 PX（C7C7C7C7C7，53PX0-0-0-0-0-0-0-0-0-8 PX0-C7，C7，53PX0-0-0-0-0-8 PX0-0-8 PX0-8 PX0-8 PX0-C7-C7，C7-C7，53PX0-C7，53PX0-0-0-0-8-0-8 PX0-8-8-8-8-8-C7-C7-C7-C7，C7-8-C7C7、59PX0-8px、c7c7c7、60PX0-8px、c7c7c7、61PX0-8px、c7c7c7、62PX0-8px、c7c7c7、63PX0-8px、c7c7c7、64PX0-8px、C7C7、65PX0-c7c7c7，67PX0-0-8 PX0-8 PX（C7C7）C7，67PX0-8 PX（C7C7）C7C7，c7c7c7，C7C7，c7c7c7，68PX0-0-8 PXC7，68PX0 0-8 PX（C7C7C7C7）C7，66PX0 0-8 PX0-8 PX0-8 PX0-8 PX（C7）C7C7，C7C7C7C7，C7，C7-8-8-8-8-8-8-8-8-8 PX0-8-8-8-8 PX（C7，c7c7c7，C7，C7，71PX0-0-8-8-8-8-8-8-8-C7，C7，C7，C7，C7，71PX0-8-8-8-8-8-8-8-74PX0-8px#c7c7c7、75PX0-8px#c7c7c7、76PX0-8px#c7c7c7、77PX0-8px#c7c7c7、78PX0-8px#c7c7c7、79PX0-8px#c7c7c7、80PX0-8pxC7C7C7C7，82PX0 0-8 PX（c7c7c7，82PX0-8 PX（c7c7c7，C7C7 c7，c7 c7 c7，c7 c7 c7，c7 c7 c7，83PX0 0 0-8 PX0-8 PX（C7C7 c7 c7 c7 c7，c7 c7 c7 c7 7，85PX0 0 0-8 PX0-8 PX0-8 PX0-8 PX0-8 PX0-8像素（c7）c7（C7C7）c7，C7C7，c7，C7C7，c7 7-8-8-8-8-8-8-8-8-8-8-8-8-8-8像素（c7，c7，c7，c7，c7，86PX0-c7，c7，c7，86PX0-8-8-8-8-8-8-8-8 0-8px#c7c7c7，90px 0-8px#c7c7c7，91px 0-8px#c7c7c7，92px 0-8px#c7c7c7，93px 0-8px#c7c7c7，94px 0-8px#c7c7c7，95px 0-8px#c7c7c7，97PX0 0-8 PX0 0-8 PX0 0-8 PX（c7c7）c7c7，98PX0 0-8 PX（c7c7）C7 7，98PX0 0 0-8 PX0-8 PX0-8 PX（c7c7）C7，98PX0 0 0-8 PX（C7）C7，C7C7C7C7C7，97PX0 0 0-8 PX0-8 PX（c7c7c7）C7，c7c7c7，101PX0-0-8-8-8-8-C7C7C7C7，c7c7，C7，101PX0-0-0-8 PX0-8 PX0-8-8-8-8 PXC7C7（c7c7（C7）c7c7c7-8-8-C7，10-C7，10-8-8-8-8-8-C7，101PX7#c7c7c7、105PX0-8px#c7c7c7、106PX0-8px#c7c7c7、107PX0-8px#c7c7c7、108PX0-8px#c7c7c7、109PX0-8px#c7c7c7、110PX0-c7c7c7，112PX0-0-8 PX0-8 PX（C7C7）C7，112PX0-8 PX（C7C7）C7，c7c7c7，C7C7，C7C7，c7c7c7，113PX0 0 0-8 PX，113PX0 0-8 PX（C7C7C7C7C7）C7，111PX0 0-8 PX0-8 PX0-8 PX0-8 PX0-8-8 PX（c7c7c7）C7，C7C7，C7C7，116PX0-0-0-0-0-8-8-8-8 PX0-8-8 PX0-8-8 PX0-8-8-8-8-8-8-8 PX0-8-8-8-8-8-8-8-8-8-8-8-8-8 PX0-8-8像素（C7，C7，C7 119PX0-8px#c7c7c7、120PX0-8px#c7c7c7、121PX0-8px#c7c7c7、122PX0-8px#c7c7c7、123PX0-8px#c7c7c7、124PX0-8px#c7c7c7、，c7c7c7、127PX0 0-8 PX C7C7、127PX0 0-8 PX0-8 PX C7C7、127px 0-8 PX（c7c7c7、c7c7c7、c7c7c7、128PX0 0-0-8 PX0-8 PX C7-C7C7、128PX0 0-8 PX0-8像素（C7C7C7C7C7C7C7）C7、126PX0-0-0-8 PX0-8-8 PX0-8 PX0-8PX0-8 PX0-8像素（C7C7C7C7C7C7C7C7C7C7C7C7、130PX7、130PX0-0-0-0-0-0-0-0-8-8-8 PX0-8 PX0-8-8-8-8-8 PX0-8-8-8 PX0-8像素、130PX0-8-8 c7c7c7、134PX0-8px、c7c7c7、135PX0-8px、c7c7c7、136PX0-8px、c7c7c7、137PX0-8px、c7c7c7、137PX0-8px、c7c7c7、138PX0-8px、c7c7c7、139PX0-8pc7c7c7，141PX0 0-8 PX0-8 PX（C7C7）C7，141PX0 0-8 PX（C7C7）C7C7，c7c7c7，c7c7c7，c7c7c7，142PX0 0-8 PX 0-8 PX（C7C7C7C7）C7，C7C7 C7 C7 7，144PX0 0 0-8 PX0-8 PX0-8 PX（C7）C7（C7）c7c7c7，C7，C77C7-8-8-8-8-8像素（C7，C777C7，145PX0-8-8 PX0-8 PX0-8-8 PX0-8-8像素（C7，C7，C7，C7，1450-8-8-8-C7，145PX0 0-8-8-8-8-8-8-8-8-8-8 148PX0-8px#c7c7c7、149PX0-8px#c7c7c7、150PX0-8px#c7c7c7、151PX0-8px#c7c7c7、152PX0-8px#c7c7c7、153PX0-8px#c7c7c7、15c7c7c7，156PX0 0-8 PX0 0-8 PX0 0-8 PXC7C7C7，156PX0 0-8 PXC7，156PX0 0-8 PX0 0-8 PXC7，C7C7C7C7，157PX0 0 0-8 PX0-8 PX0-8 PX0-8 PXC7C7C7，158PX0 0-8 PX0-8 PX0-8 PXC7C7C7，159PX0 0 0-8-8 PXC7C7C7，1590-0-8-8 PX0-8 PX0-8-8-8 PX0-8-8 PX0-8-8-8-8-8像素（C7-8-8像素；C7C7-8-8-8-8像素；c7c7c7-8-8-8像素；C77C7-8-8-8-8八八八八八八八八八八八八八八八八c7c7c7、163PX0-8px、c7c7c7、164PX0-8px、c7c7c7、165PX0-8px、c7c7c7、166PX0-8px、c7c7c7、166PX0-8px、c7c7c7、167PX0-8px、c7c7c7、168PX0-8px#C7C7，170PX0 0-8 PX0 0-8 PXPX0 0-8 PX（C7C7）C7C7，174PX0 0-8 PX（C7C7）C7C7，C7C7 7，171PX0 0 0-8 PXC7，171PX0 0-8 PX0-8 PXC7，C7C7C7C7C7，173PX0 0 0-8 PX0-8 PXPX（C7C7）C7，C7C7C7C7，174PX0 0 0-0-8-8-8像素（C7，C7，1740-0-0-8 PX0-8-8像素（C7，C7）C7，C7，C7，C7，C7，1740-8八八八八八八八八八八八八八八八八八八八八八八八八八八八八八八八八八八八八八八八八八八八八八八八八八八八PX#c7c7c7、178PX0-8px#c7c7c7、179PX0-8px#c7c7c7、180PX0-8px#c7c7c7、181PX0-8px#c7c7c7、182PX0-8px#c7c7c7、183pX0-8px#c7c7c7、184px 0-8px#c7c7c7、185px 0-8px#c7c7c7、186px 0-8px#c7c7c7、187px 0-8px#c7c7c7、188px 0-8px#C7C7C7C7C7、189px 0-8px
::-webkit-slider-thumb {
    @include size($thumb-width $thumb-height);

    appearance: none;
    background: $thumb-background;
    border-radius: $thumb-radius;
    box-shadow: makelongshadow($background-slider, $shadow-size);
    margin-top: $fit-thumb-in-slider;
    border: $thumb-border;
}