Question

我在使用Microsoft Edge中的几个内联块div时遇到了一些麻烦。第二个div失去边界或者只是显示为一个大黑盒子。我在HTML5页面上使用Windows 10。 Internet Explorer和其他浏览器似乎工作正常。经过一番摆弄后，我把问题缩小到以下几行：

＆＃13;

div {
  background-color: #f5f5f5;
  border: 1px solid #ddd;
  display: inline-block;
  padding: 10px;
}

div button {
  color: #fff;
  border: 0;
  background: #428a00;
  background: -moz-linear-gradient(top, #428a00 0%, #4fa600 100%);
  background: -webkit-linear-gradient(top, #428a00 0%, #4fa600 100%);
  background-image: linear-gradient(to bottom, #428a00 0%, #4fa600 100%);
  filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#428a00', endColorstr='#4fa600', GradientType=0);
}

＆＃13;

<div>
  <button>Submit</button>
</div>
<div>Conditions</div>

＆＃13;

JSFiddle

我可以删除任何边框属性，display：inline-block属性或渐变属性，一切都很好。现在我想知道，这是Edge中的一个错误吗？我检查并重新检查了css渐变，一切似乎都井然有序。我错过了什么吗？

在Microsoft Edge中导致显示错误的渐变

0 个答案: