Html 将鼠标悬停在已赢得的图像上'；t与缩放的图像正确对齐

尝试在悬停时放大65x65图像，确实如此，但悬停覆盖并没有为任何图标居中。有什么想法吗

.overlay{
位置：绝对位置；
文本对齐：居中；
宽度：100%；
身高：100%；
不透明度：0；
显示：块；
排名：0；
左：0；
左边距：自动；
右边距：自动；
背景色：#3b5998；
边界半径：50px；
边距：5px；}
.图标{
位置：相对位置；
宽度：100%；
宽度：65px；
高度：60px；
显示：内联块；
保证金：5px；
}

姓名

您需要去掉

边距：5px.overlay

选择器中选择code>css属性，将覆盖与图像对齐。试试这个代码

.icon{
    position: relative;
    width: 100%;
    width:65px;
    height:65px;
    display: inline-block;
    margin: 5px;
    border-radius: 50%;
    overflow: hidden;
}
.icon img {
  width: 100%;
}
.overlay{
    position:absolute;
    text-align: center;
    width: 100%;
    height:100%;
    opacity: 0;
    display: block;
    top: 0;
    left: 0;
    margin-left: auto;
    margin-right: auto;
    background-color: #3b5998;
    border-radius:50%;
    z-index: 2;
    }
.icon:hover .overlay {
  opacity: 1;
}

---

如果你展示一些代码来获得一个想法会更好。现在编辑，谢谢你的代码似乎不完整。建议包含完整的代码，包括悬停状态。我认为这是一个悬停问题。乐意帮助，继续编码：）请按勾选按钮接受答案。