chrome 和歌剧中的溢出问题

Question

我在 0px height width 新版本的 overflow 元素上遇到问题

我的源代码 (jsfiddle)

代码以前工作得很好，但我在最新的 chrome 和 opera 中遇到了这个问题（在 firefox 和 edge 中没有）

css:

.cssload-dots {
    width: 0;
    height: 0;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    outline: 1px solid red;
    filter: url(#goo);
        -o-filter: url(#goo);
        -ms-filter: url(#goo);
        -webkit-filter: url(#goo);
        -moz-filter: url(#goo);
}

当我将 width 和 height 更改为 200px 时，一切正常...

但我无法改变这个...

因为我在我的所有网站页面上都使用了这段代码，如果我更改它，可能会损坏所有其他部分

编辑：

当我通过检查元素禁用过滤器时，一切正常...

也许 svg 过滤器有问题，但我对 svg 一无所知

编辑：

我换了 svg，更好但还不够

<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
  <defs>
    <filter id="goo">
      <feGaussianBlur in="SourceGraphic" stdDeviation="12" result="blur" />
      <feColorMatrix in="blur" mode="matrix" values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 18 -7" result="goo" />
      <feBlend in="SourceGraphic" in2="goo" />
    </filter>
  </defs>
</svg>

Answer 1

这是 google chrome...

中的错误

我报告了这个问题，它会在新版本中修复

chrome 和歌剧中的溢出问题

overflow issue in chrome and opera

css

opera

svg

google-chrome

overflow