[ERLEDIGT] Navigation Menü verschiebt sich durch padding.

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

Graflx

Neues Mitglied
23 März 2019
3
0
1
17
Hallo :),

ich bin noch ein relativ kleiner Anfänger in HTML, weswegen ich jetzt hier Hilfe suche. Vielleicht kann mir ja jemand helfen! :p

Mein Problem:
Ich habe eine Navigation mit HTML und CSS erstellt und diese verschiebt sich immer ein wenig nach links. DAs möchte ich natürlich nicht. Ich möchte nur, dass der Text fixiert ist und nur die Umrandung darum erscheint.

[CODES]

<!DOCTYPE html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="style.css">
<title></title>
</head>
<body>
<header>
<nav id="nav">
<ul>
<a href="#contact"><li>CONTACT</li></a>
<a href="#work"><li>WORK</li></a>
<a href="#about"><li>ABOUT</li></a>
<a href="#home"><li>HOME</li></a>
</ul>
</nav>
</header>
</body>
</html>



html, body {margin: 0; padding: 0; height: 100%; width: 100%; text-align: center;}
section {min-height: 100%;}
a {text-decoration: none;}
li {list-style-type: none;}
header nav ul li:hover {transition: all 300ms; -webkit-transition: all 300ms; -moz-transition: all 300ms; -o-transition: all 300ms;}

header nav ul li {
float: right;
text-align: right;
margin: 45px 50px 0 0;
padding: 8px 10px 8px 10px;
}

header nav ul li:hover {
border-radius: 20px;
border-style: solid;
border-width: 1px;
padding: 8px 10px 8px 10px;
}

LG Felix :)
 
Zuletzt bearbeitet:

m.scatello

Aktives Mitglied
15 Februar 2017
855
90
28
padding: 8px 10px 8px 10px;

Da verschiebst du den Inhalt, nimm diese Zeile raus oder trage sie bei header nav ul li ein
 

Graflx

Neues Mitglied
23 März 2019
3
0
1
17
Okay ich habs jetzt herausgefunden. Ich habe einfach die Umrandung auf das padding der header nav ul li addiert und fertig. :)
 
Werbung: