• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Abstand verschwindet nicht

SinLi

Neues Mitglied
Hallo, leider konnte ich das Abstand zwischen nav und des banners trotz des schon vorhandenen Abstand-Artikels nicht loesen...
hier ist mein html-code:


<html>
<head>
<meta charset="utf-8">
<style type="text/css">
</style>
<link rel="stylesheet" type="text/css" href="stylesheet.css">
<title>Leben Malen</title>
</head>

<!--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>
</html>



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
 
Werbung:
Ich versteh die Fragestellung leider nicht wirklich? Und kann man das auch irgendwo online sehen? Welchen Doctype nutzt Du?
 
Hey, ich benutze <!DOCTYPE html>...
habe mal ein Bild hochgeladen... es geht um den hellen Abstand zwischen dem Menu und "Welcome on my Website!".
Danke und lg
 

Anhänge

  • website.jpg
    website.jpg
    81,4 KB · Aufrufe: 12
Werbung:
Werbung:
Das hat jetzt zwar nichts mit dem Problem zu tun, aber so etwas geht schon mal gar nicht:

HTML:
</head>

<!--body-->
<div id="body-wrapper" class="container">
<body>

Schau dir bitte noch mal ein HTML Grundgerüst an.

Gruss
Elroy
 
Das hat jetzt zwar nichts mit dem Problem zu tun, aber so etwas geht schon mal gar nicht:

HTML:
</head>

<!--body-->
<div id="body-wrapper" class="container">
<body>

Schau dir bitte noch mal ein HTML Grundgerüst an.

Gruss
Elroy
Hallo, danke für deinen Hinweis!
Meinst du, dass id und class in einem div stehen? Bin ein ziemlicher Anfänger und das ist eigentlich das erste Mal, dass ich div id's und classes benutze, deshalb sind wahrscheinlich sehr viele Fehler drin...
Lg
 
Hallo, danke für deinen Hinweis!
Meinst du, dass id und class in einem div stehen? Bin ein ziemlicher Anfänger und das ist eigentlich das erste Mal, dass ich div id's und classes benutze, deshalb sind wahrscheinlich sehr viele Fehler drin...
Lg
http://www.html-seminar.de/html-seitenaufbau.htm
http://www.wurmweb.at/index.php?title=HTML-Grundgerüst_mit_HTML5
http://www.pixelsgarden.de/schnipsel/30-simples-html5-grundger

Nächstes mal Google bedienen!
 
Werbung:
Werbung:
Zurück
Oben