Html 填充顶部不起作用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14604541/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Padding-top not working
提问by Mantas Kudeikis
Why doesn't padding-topwork? The height of the divis set.
为什么不起作用padding-top？设置的高度div。
HTML:
HTML：
<div class="menu">
<a href="#">APIE MUS</a>
<a href="#">REKLAMA</a>
<a href="#">PARTNERIAI</a>
</div>
CSS:
CSS：
.menu {
width: 300px;
height: 30px;
background: red;
}
.menu a {
padding-top: 10px;
}
回答by gearsdigital
Your example (with margin) does not work because you can't apply margin to inline elements like a, span, b.
您的示例（带边距）不起作用，因为您无法将边距应用于像a, span, b.
Take a look:
看一看：
- http://www.webdesignfromscratch.com/html-css/css-block-and-inline/
- http://webdesign.about.com/od/htmltags/qt/block_vs_inline_elements.htm
- http://www.webdesignfromscratch.com/html-css/css-block-and-inline/
- http://webdesign.about.com/od/htmltags/qt/block_vs_inline_elements.htm
To fix your issue:
要解决您的问题：
Just add display:inline-block;
只需添加 display:inline-block;
This value (inline-block) causes an element to generate an inline-level block container. The inside of an inline-block is formatted as a block box, and the element itself is formatted as an atomic inline-level box. Source:http://www.w3.org/TR/CSS2/visuren.html#inline-level
该值 (inline-block) 使元素生成内联级块容器。行内块的内部被格式化为块框，元素本身被格式化为原子行级框。 来源：http : //www.w3.org/TR/CSS2/visuren.html#inline-level
So this will fix your issue:
所以这将解决您的问题：
.menu a{
margin-top: 10px;
display:inline-block;
}
