奇怪的问题:
.nav_active {
padding: 8px 0 8px 0;
border-top: 5px solid #2778ad;
border-bottom: 5px solid #2778ad;
border-left: none;
border-right: none;
}
<span class="nav_active"><a class="active" href="/home">Home</a></span>
在 FF 中这工作正常,有两个 5px 的边框,顶部和底部的链接距离为 8px。在 chrome 中,这些行指向链接文本。如果我在左侧和右侧制作边框,它也适用于 chrome。
有人知道为什么这在 chrome 上不起作用吗?
最佳答案
使用 block 或内联 block
元素:
.nav_active {
padding: 8px 0 8px 0;
border-top: 5px solid #2778ad;
border-bottom: 5px solid #2778ad;
border-left: none;
border-right: none;
display: inline-block;/*now padding-top,padding-bottom gets affected properly*/
}
关于css - chrome/safari 中不显示边框的边距,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27988191/