我想删除按钮之间的空格,这样当我将鼠标悬停在 NORMAL 按钮上时,它和 HARD 按钮之间就没有空格了。我该怎么做,这些空白是从哪里来的?
body {
margin: 0;
}
#stripe {
background-color: white;
text-align: center;
height: 50px;
color: black;
}
button {
border: none;
background: none;
text-transform: uppercase;
height: 100%;
font-weight: 700;
color: black;
letter-spacing: 1px;
font-size: inherit;
transition: all 0.3s;
outline: none;
}
button:hover {
color: white;
background: black;
}
.selected {
color: white;
background: black;
}
<div id="stripe">
<button class="mode">Easy</button>
<button class="mode">Normal</button>
<button class="mode selected">Hard</button>
</div>
原文由 Huy Tran 发布,翻译遵循 CC BY-SA 4.0 许可协议
删除空格和回车符,或者在它们之间放置 HTML 注释。