nicht angemeldet
Frage zum Wiki-Artikel „Navigation“
Matthias Scharwies
Gunnar BittersmannHallo,
eine kleine Frage zu der Navigation (der ersten der Beispiele). Wieso werden mir die Listenelemente nicht dargestellt? Ich habe den Code (Euren Code) zuerst einmal 1:1 übernommen.
html {
background: #9D9E9E;
}
svg {
background: #9D9E9E;
border: 0;
position: absolute;
top: 0;
left: 0;
width: 100%;
padding: 0;
height: 208px;
margin: 0;
}
#logo {
background-image: url(images/Logo.png);
z-index: 2;
width: 1437px;
height: 208px;
position: absolute;
top: 0;
left: 0;
margin: 0;
border: 0;
}
/* Navigation Listenelemente */
nav ul {
margin: 0;
padding: 0;
}
nav li {
list-style: none;
margin: 0;
padding: 0;
}
<!DOCTYPE HTML>
<html lang="de">
<head>
<meta charset="utf-8">
<meta name="description">
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <!-- Geänderte Darstellung für mobile Endgeräte -->
<link href="style.css" rel="stylesheet" type="text/css" media="screen" />
<title>TITEL DER WEBSITE</title>
</head>
<body>
<main>
<svg viewbox="0 0 100% 208">
<defs>
<linearGradient id="verlauf" x1="0%" y1="0%" x2="100%" y2="0%">
<stop offset="0%" stop-color="#5C5C5C" />
<stop offset="41%" stop-color="#5C5C5C" />
<stop offset="67%" stop-color="#767776" />
<stop offset="100%" stop-color="#5C5C5C" />
</linearGradient>
</defs>
<rect id="eins" x="0" y="0" width="100%" height="208" fill="url(#verlauf)" />
<div id="logo"></div>
</svg>
</main>
<nav>
<ul>
<li><a href="#">Seite 1</a></li>
<li><a href="#">Seite 2</a></li>
<li><a href="#">Seite 3</a></li>
<li><a href="#">Seite 4</a></li>
</ul>
</nav>
</body>
</html>
Der Markup die Navigation betreffend ist absolut identisch. Außer, ich habe einen Fehler eingebaut und selbigen selbst nach dem zehnten Mal lesen überlesen. Ich hoffe, mir kann jemand auf die Sprünge helfen. Danke schon mal im voraus.
-
Servus!
Du hast innerhalb des svg-Elements ein div-Element. Das geht so nicht.
Evtl. liegt es da dran.
Herzliche Grüße
Matthias Scharwies
--
"I don’t make typos. I make new words."-
Hallo.
Nein, daran lag es nicht. Habe zwar das DIV aus dem SVG herausgenommen/versetzt. Es war jedoch so, dass die Navigation nicht zu sehen war, da sie unter dem Logo "versteckt"/platziert war.
-
-
@@Da Ignaz
<svg viewbox="0 0 100% 208">Das wird so nichts. Der Wert des
viewBox-Attributs (bei SVG in CamelCase) müssen 4 Zahlen sein, keine Prozentwerte.LLAP 🖖
--
„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“ —Kurt Weidemann