chrome和opera中的溢出问题答案

【问题标题】：overflow issue in chrome and operachrome和opera中的溢出问题
【发布时间】：2016-06-15 18:08:10
【问题描述】：

我对新版本中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>

【问题讨论】：

谁能帮帮我？

标签： css google-chrome svg overflow opera

【解决方案1】：

这是谷歌浏览器中的一个错误......

我报告了，它将在新版本中修复

【讨论】：