Html div 内的上边距不起作用？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4015053/
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
Top margin inside a div do not work?
提问by haansi
I have a div that contains links (a href). All other margins are working with a href but Top margin is not working with a href. I want to place links in middle but because of not working of top margin it is not being possible. I heared by setting position or display it can work. Please suggest a cross broswer solutions for it.
我有一个包含链接的 div（a href）。所有其他边距都与 href 一起使用，但顶部边距不与 href 一起使用。我想将链接放在中间，但由于上边距不起作用，这是不可能的。我听说通过设置位置或显示它可以工作。请为它建议一个跨浏览器的解决方案。
div.MainContainer div.Links
{
height: 57px;
width: 100%;
border-top: solid 0px #404040;
border-left: solid 2px #404040;
border-right: solid 2px #404040;
border-bottom: solid 2px #404040;
background-image: url("../Images/links_background.png");
}
div.MainContainer div.Links a
{
font:12px verdana;
color:White;
margin:10px;
border:dashed 1px white;
margin:15px 20px 20px 20px ;
width:100px;
}
回答by Badr Hari
You need to float element to make margin working or use padding instead.
您需要浮动元素以使边距起作用或改用填充。
div.MainContainer div.Links a
{
float: left;
font:12px verdana;
color:White;
margin:10px;
border:dashed 1px white;
margin:15px 20px 20px 20px ;
width:100px;
}
回答by MatTheCat
Height of inline elements can't be changed, just use display:inline-block;on your links.
内联元素的高度无法更改，只需display:inline-block;在您的链接上使用即可。
回答by ryanulit
Try below. I added overflow: hiddento the top definition and display: blockand float: leftto the bottom definition. The first addition clears the float being added, and the last two allow the margin on the links to work correctly.
下面试试。我添加overflow: hidden到顶部定义，display: block并float: left在底部的定义。第一个添加清除正在添加的浮动，最后两个允许链接上的边距正常工作。
div.MainContainer div.Links
{
height: 57px;
width: 100%;
border-top: solid 0px #404040;
border-left: solid 2px #404040;
border-right: solid 2px #404040;
border-bottom: solid 2px #404040;
background-image: url("../Images/links_background.png");
overflow: hidden;
}
div.MainContainer div.Links a
{
font:12px verdana;
color:White;
margin:10px;
border:dashed 1px white;
margin:15px 20px 20px 20px ;
width:100px;
display: block;
float: left;
}
回答by Brad
Try padding-topon the div.Linksrather than margin-topon the div.Links a.
尝试padding-top对div.Links，而不是margin-top上div.Links a。
回答by Khánh Tr?n
use padding-top: 1px(at least) for the div.Linksand you don't need to use float on the div.Links a
使用padding-top: 1px（至少）用于div.Links并且您不需要在div.Links a
