css - 填充+宽度

Question

我有底部边框的链接，在 CSS 中是这样的:

a {
    display: block;
    width: 100%;
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 30px;
    border-bottom: 1px solid #EEE;
}

我有问题，因为“填充”值被添加​​到宽度值并且边框底部太长:

http://screenshooter.net/9186066/advygxa

你有什么想法吗？

Answer 1

内边距和宽度很难共存；只需删除您的宽度声明即可。由于您的 anchor 是 block 状的，它们将自动占据 100% 的宽度(包括填充):

a {
    display: block;
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 30px;
    border-bottom: 1px solid #EEE;
}

现在它应该占据 100% 的宽度。