按钮元素滑出(镀铬)

我在一个小项目上工作,我想添加一个可以打开菜单的按钮。该按钮在Firefox上看起来不错,但是当我检查勇敢或镀铬时,按钮元素似乎滑出,我无法查明它是什么...

Button on Firefox

Button on Chrome

这是带有内部元素的按钮。

<button id="add-menu">
        <img src="plus.png" height="40px" id="plus-minus-icon"><p>Add New Menu</p>
    </button>

这是CSS代码,希望对您有所帮助。

#add-menu {
grid-area: 5 / 1 / 5 / 3;
height: 100%;
width: 80%;
background-color: #333333;
border-radius: 25px;
justify-self: center;
display: flex;
align-items: center;
border: 1px solid black;

z-index: 1;
}
#add-menu img {
margin-left: 5px;
}
#add-menu p {
color: white;
font-size: 24px;
line-height: 50px;
}
评论