position: absolute; top 130px; display:block;
感谢所有响应...代码集上的代码也已修复..:D
编辑:所以我修复了内容持有者的问题,现在我有一个新的,我不能把他移到我的主...我一直在尝试垂直对齐,它不起作用Codepen:http://codepen.io/anon/pen/VvKdrL
我的新代码:
header>a
{
font-size: 38px;
font-weight: 500;
border-bottom: 1px solid #888;
text-align: left;
color: #555;
font-family: "Monserat";
}
header
{
border-bottom:1px solid #888;
}
main
{
height: 530px;
display: block;
margin-top: -40px;
}
ul
{
list-style-type: none;
}
li a
{
font-size: 22px;
font-family: Helvetica;
margin: 4px;
font-weight: 500;
font-family: "Roboto";
line-height: 34px;
color: #222;
}
a
{
text-decoration: none;
}
li::before
{
content: "➢";
}
.center
{
width: 960px;
margin: 0 auto;
}
.content-holder
{
position: absolute;
width: 250px;
height: 200px;
top: 130px;
background: #eee;
display: block;
z-index: 2;
}
.background
{
z-index: 1;
background-repeat: no-repeat;
}
.footer
{
border-top: 1px solid #888;
height: 20px;
content:
}
<html>
<head>
<meta charset="UTF-8">
<title>Title</title>
<link href='https://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Roboto:500,700&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<header class="center">
<a href="index.html" class="header">Name</a>
</header>
<main class="center sizemain">
<div class="background"></div>
<div class="content-holder">
<ul>
<li>
<a href="#" class="special" target="_blank">List </a>
</li>
<li>
<a href="#" target="_blank">List </a>
</li>
<li>
<a href="#" target="_blank">List</a>
</li>
<li>
<a href="#" target="_blank">List</a>
</li>
<li>
<a href="#" target="_blank">List</a>
</li>
</ul>
</div>
</main>
<footer class="footer">
</footer>
</body>
</html>
感谢回复
答案 0 :(得分:0)
您需要注释保证金最高和保证金。保证金适用于每一方50px。
.content-holder {
width: 250px;
height: 190px;
background: #eee;
/* margin: 30px; */
/* margin-top: 50px; */
vertical-align: 50px;
z-index: 2;
}