padding-top不工作但padding-right是

Question

这是我的css：

body { 
margin: 0px;
background-color: white;
}

#navbar { 
background-color: red;
margin: 0 auto;
width: 900px;
height: 200px;
}

#navbar a { 
padding: 20px;
color: grey;
text-decoration: none;
font-weight: bold;
font-size: 20px;
}

navbar是一个内部div，我在导航栏中有几个标签。

这是输出：

Answer 1

＆＃39; 阻止级别＆＃39;元素和＆＃39; 内联元素＆＃39;。边缘和边缘内联元素的填充＆＃39;根据基本概念，仅在水平方向中有效，但在垂直方向中无效。

您的Div是块级元素，但锚标记是内联元素。为了给出垂直空间，使它成为一个块元素，就像你已经发现的那样，或者将锚点放在div中，div具有“填充”形式的垂直空间。或者＆＃39;保证金＆＃39;！

div a {display:block;padding:20px;} OR div a{display:inline-block;padding:20px;}

在后两种情况下，填充现在也会在垂直方向上起作用，就像现在已经从内联形式转换为块级元素一样。希望，这有帮助！

Answer 2

我想出来了，我只需要使用：display:inline-block;

Answer 3

您可以尝试这样做： Demo

#navbar a {       
    display:block;
    float:left;
}