Hallo, leider konnte ich das Abstand zwischen nav und des banners trotz des schon vorhandenen Abstand-Artikels nicht loesen…
hier ist mein html-code:
<!--body-->
<div id="body-wrapper" class="container">
<body>
<!--header-->
<div id="header">
<!--navigation-->
<div id="nav-wrapper">
<nav id="nav">
<ul>
<li><a href="Home.html">Home</a></li>
<li><a href="About-me.html">About me</a></li>
<li><a href="Blog.html">Blog</a></li>
<li><a href="Contact.html">contact</a></li>
</ul>
</nav>
</div>
<!--Banner-->
<div id="banner">
<h1>Welcome on my Website!</h1>
</div>
<!--SectionOne-->
<div class="wrapper1">
<section class="container">
<h2>...</h2>
<p>orem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
</section>
</div>
<!--SectionTwo-->
<div class="wrapper2">
<section class="container">
<h2>...</h2>
<p>Sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
</section>
</div>
</div>
</body>
</div>
und mein stylesheet dazu:
/body/
#body-wrapper{
background-color: #f6eeed;
margin: 0px;
}
/banner/
#banner{
background-color: #e37d77;
text-align: center;
margin: 0px;
}
/header/
#header{
}
/navigation/
#nav-wrapper{
background: #e37d77;
width: 100%;
margin: 0px;
}
#nav >ul{
padding: 1em;
text-align: center;
}
#nav >ul>li {
display: inline-block;
border-right: 2px solid;
border-color: rgba(255,255,255,.5);
}
#nav >ul >li >a {
display: inline-block;
padding: 1.5em 1.5em;
letter-spacing: 0.06em;
text-decoration: none;
text-transform: uppercase;
font-size: 1.2em;
outline: 0;
color: #FFF;
font-weight: bold;
}
/*Classes/
/container/
.container{
width: auto;
height: auto;
font-family: sans-serif;
}
.wrapper1{
padding: 1em;
margin: 1em;
}
.wrapper2{
padding: 1em;
margin: 1em;
}
ich habe versucht, margin: 0px am anfang einzufuegen (also body-wrapper), ausserdem noch in den nav-wrapper und banner. klappt aber leider alles nicht. Wuerde mich freuen, wenn jemand einen Tipp hat
Lg