按钮悬停时Microsoft Edge调整大小问题

Question

这是我的html和css：fiddle

.right {
  float: right;
}
.scroll {
  max-height: 100px;
  overflow-y: auto;
}

<div class="right">
    <button>x</button>
    <div class="scroll">
        <div>testtesttesttest testtest</div>
        <div>testtesttesttest testtest</div>
        <div>testtesttesttest testtest</div>
        <div>testtesttesttest testtest</div>
        <div>testtesttesttest testtest</div>
        <div>testtesttesttest testtest</div>
        <div>testtesttesttest testtest</div>
    </div>
</div>

当我将鼠标悬停在Microsoft Edge上的按钮上时，内部div正在调整大小。

在这个简单版本中，我可以通过按钮悬停产生错误，但在我的实际情况下，当我点击窗口上的任何位置时会发生调整大小。

Answer 1

虽然这不是完美的解决方案。 将display: inline置于.scroll l并再次处于悬停状态以解决问题。

尝试这一方面 Code pen link