Probleme mit em

[Gunnar Bittersmann]

@@bleumi85

	<img id="logo" src="images/therminator2.png" />
	<nav class="nav">
		<ul>
			<li><a href="#" class="active">Home</a></li>
			<li><a href="#">Kontakt</a></li>
			<li><a href="#">bla bla</a></li>
			<li><a href="#">Bilder</a></li>
			<li><a href="#">Videos</a></li>
		</ul>
	</nav>

Das Logo und die Navigation würden gut in einem header gruppiert sein.

	<section id="main">

section ist für (mehrere) Unterabschnitte. Für den einen(!) Hauptinhalt dient – wie Matthias schon sagte – das main-Element. Womöglich brauchst du dafür keine ID.

Apropos ID:

#Main{
	background:white;
	margin:0 15% 2em 15%;
}

Das kann nicht wirken; der Selektor #Main passt nicht zur ID "main".

---

	<?php
		for($i=1; $i<=100; $i++){
			echo "Dies ist ein cooler Test! Nummer: ".$i."<br>";
		}
	?>

Ich würde niemals™ Markup mit PHP generieren, sondern PHP in HTML schachteln – mit der alternativen Syntax für Kontrollstrukturen:

<?php for($i=1; $i<=100; $i++): ?>
  Dies ist ein cooler Test! Nummer: <?php echo $i; ?><br>
<?php endfor; ?>

---

.nav ul li{…}

.nav ul li a{…}

Die Selektoren sind überspezifiziert. Mache Selektoren nur so spezifisch wie nötig: .nav li und .nav a.

Aber wie Matthias schon sagte, brauchst du die Klasse "nav" nicht. Du kannst auch per Elementtyp nav, nav ul, nav li und nav a selektieren.

---

Wenn ich dem nav-Bereich eine Höhe von 3em gönne, die Textgröße auf 1em setze und das padding auch, wieso hab ich dann überstehende Ränder?

Was heißt „überstehende Ränder“? Online-Beispiel, bitte.

LLAP 🖖