CSS：margin-bottom不起作用，并且div标签的内容显示在边框外

Question

我想取消标题部分的导航链接。它们都在div类“ headers”下的div类“ links”中。

但是arr属性没有任何影响。

所以要检查位置是否有变化，我将div类周围的边框设为“链接”。

但是当边框出现时，所有导航链接都显示在框外。

margin-bottom对边界框也没有影响。

Jsfiddle：http://jsfiddle.net/L2k67eyx/

请让我知道我的代码有什么问题吗？还有margin-bottom属性何时有效的所有规则？

代码段：

margin

body{
	height: 100vh;
	margin: 0px;
}
.header{

	background-color: white;
	height:50%;
	overflow: hidden;
	font-style: "Roboto";
	font-size: 25px;
	border-bottom: 2px solid;
	border-bottom-color: #cccccc;
}
.content{
	position: relative;
	background-color: white;
	height: 90%;
	overflow-y: auto;
}

.logo{
	float: left;
	left: 0px;
	padding-right: 50px;
}
#logo:hover{
	background: transparent;
}
.links{
	display: block;
	float: right;
	margin-right: 10px;
	margin-bottom: 10px;/*NOT WORKING*/
	/*right: 100px;*/
	border-style:solid;
	border-color: black;

	outline-style: solid;
	outline-color: green;
}
a{
	position: relative;
	right: 0px;
	top: 25px;

	padding-left: 10px;
	padding-right: 10px;

	color:black;
	letter-spacing: 2px;
	font-weight: 200;
	text-decoration: none;
}
a:hover{
	background-color:#cccccc; 
}

Answer 1

您应该删除样式为

的标记中的top：0px边距

a{
            position: relative;
            right: 0px;
            top: 0px;

            padding-left: 10px;
            padding-right: 10px;

            color:black;
            letter-spacing: 2px;
            font-weight: 200;
            text-decoration: none;
        }