[ERLEDIGT] Navigation Menü verschiebt sich durch padding.

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

Werbung

Jetzt auf elektrisches Fahren umstellen, Umwelt schonen und 1.500km kostenlosen Strom von Tesla bekommen. https://ts.la/carsten15473.

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
957
103
43
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: