Warum hat das Menü trotzdem noch Abstand?
Ich bin ein relativer Anfänger wenn es ums Coden geht. Ich wollte jetzt eine Menü Leiste erstellen, doch egal was ich probiere, gibt es immer noch Abstand nach oben.
Kann mir vielleicht helfen?
Hier der Code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<style>
body {
margin: 0;
}
.Bild1 {
width: 50px;
height: 74px;
}
.Platz80 {
height: 80px;
}
.Platz20 {
height: 20px;
}
.Auswahl {
float: right;
padding-right: 30px;
font-size: 50px;
}
.Auswahl ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
}
.Auswahl li {
float: left;
}
.Auswahl li a {
color: #8e9aaf;
text-align: center;
padding-left: 30px;
}
.Auswahl li a:hover {
color: #ffcad4;
}
#MenüText {
color: #8e9aaf;
margin: 0;
padding: 0;
font-size: 30px;
}
.Menü {
margin: 0;
padding: 0;
height:100px;
background-color: #cbc0d3;
}
</style>
<div class="Menü">
<div class="Auswahl">
<ul>
<li>
<a href="/">Ziele</a>
</li>
<li>
<a href="/">Über mich</a>
</li>
</ul>
</div>
<div id="MenüText">
<h3>Willkommen!</h3>
</div>
</div>
<div class="Platz20"></div>
1 Antwort
Jedes h<1-6>-Element hat normalerweise noch einen eigenen Abstand nach oben (und unten). Du brauchst also noch eine CSS-Regel für dein h3-Element, in der du den Außenabstand setzt.
margin: 0;
Wenn du nur den Abstand nach oben entfernen möchtest, verwende stattdessen margin-top.
Beachte im Übrigen, dass das style-Element in den head-Bereich gehört. Nicht in den body.