为什么我的链接卡在浏览器的顶部边框上

Question

为什么我的链接卡在浏览器的顶部边框上？

box-sizing: border-box;不更改任何

a {
background-color: #405cf5;
color: white;
border-radius: 6px;
font-size: 1.2em;
padding: 15px 25px;
text-decoration: none;
margin-top: 20px;
}

<a href="/posts">Back</a>

Answer 1

页边距不适用于内联元素，并且只有填充的left和right属性才会推送其他元素。更改你的链接(默认为内联(以显示内联块，它将根据你给它的边距和填充移动：

a {
background-color: #405cf5;
color: white;
border-radius: 6px;
font-size: 1.2em;
padding: 15px 25px;
text-decoration: none;
margin-top: 20px;
display:inline-block;
}

<a href="/posts">Back</a>