html - CSS 悬停抖动 - 背景颜色

Question

如果您将鼠标悬停在“x”的一 Angular ，您会从更改背景颜色的 :hover 效果中获得抖动。

我研究了伪 解决方案，但我找不到任何关于背景转换的内容。

谁能在不创建额外标记的情况下提供抖动修复？

.feed__btn {
    display: flex;
    width: 12px;
    height: 12px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 50%;
    color: #6f6f90;
    font-size: 12px;
    position: absolute;
    cursor: pointer;
    transition: background-color 0.25s;
}
.feed__btn:hover {
    color: white;
    font-size: 6px;
        background-color: #e05e7f;
}

<span class="rmTag feed__btn feed__btn--unfollow">×</span>

Answer 1

在我看来，您的 12px 跨度大小似乎不能(完全)适合 12px 的字体大小。我刚刚运行了您的代码的 jsfiddle，使宽度和高度等于 14px，但无法重现抖动。而我可以用 12px 的原始大小复制它。