gpt4 book ai didi

css - 如何从带有嵌套容器的网站中删除顶部边距?

转载 作者:行者123 更新时间:2023-11-28 09:36:17 27 4
gpt4 key购买 nike

出于某种原因,用户代理覆盖了我的 css,并在我正在创建的网站顶部放置了一个边距。我在 stackoverflow 上搜索了答案,但似乎没有一个能解决我的问题。

这是一个例子:

HTML:

<!DOCTYPE html>
<html>
<head>
<title>EXAMPLE</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div class="site-wrapper">
<div class="menu">
<div class="nav">
<ul>
<li><a href="#">EXAMPLE</a></li>
<li ><a href="/spots">EXAMPLE</a></li>

<li ><a data-method="delete" href="/users/sign_out" rel="nofollow">EXAMPLE</a></li>
</ul>
</div>
</div>
<div class="content">
<p id="notice"></p>

<div class="container">

</div>
</div>
</div>
</body>
</html>

CSS:

html,
body {
height:100%;
width:100%;
margin: 0px;
display: block;
}

.site-wrapper {
display: block;
background-color: yellow;
width: 100%;
height: 100%;
}

.nav {
background-color: red;
}

.content {
background-color: blue;
width: 300px;
height: 300px;
}

.menu {
font-weight: 400;
top:50%;
margin-top:-115px;
position:absolute;
width:100%;
text-align: center;
font-size: 12px;
letter-spacing: .75;
}


ul {
list-style: none;
line-height: 40px;
padding: 0px;
display: block;
}

http://plnkr.co/edit/8IO5ux16x40UhKeSDJvN?p=preview

最佳答案

段落有默认边距。消除它:

p {
margin:0;
}

jsFiddle example

关于css - 如何从带有嵌套容器的网站中删除顶部边距?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25511104/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com