Farbe auf eine Seite kurze machen

[Rolf B]

Hallo ... Joseba? (sagt CodePen :) ) ,

in solchen Fällen öffnet man die Entwicklerwerkzeuge und schaut das Element an, das sich falsch verhält.

Ohne float:left sind die Texte in der Mitte, richtig, das liegt daran dass Du

#externalLinks a {
   text-align:center;
}

geschrieben hast. Mit dem float sind die Menüpunkte nicht mehr untereinander, das ist auch schlecht.

Wenn Dich dieses center stört, dann lass es einfach weg. Wenn Du nur die Menüpunkte des dropdown-Menüs zentrieren willst, dann setze

.dropdown-content a {
   text-align:center;
}

Statt display:inline-block in der Navigation könntest Du auch display:flex auf nav ul setzen.

Die Klassen "dropdown" und "dropbtn" brauchst Du nicht, wenn ich das richtig sehe. Statt dessen einfach li und a verwenden; eventuell noch #externalLinks davor schreiben.

Statt <div class="dropdown-content"> könnte man überlegen, <ul class="dropdown-content"> zu schreiben und die a Elemente in <li> zu kapseln. Es ist eine Liste von Menüpunkten. Was ist, wenn das CSS nicht geladen wird? Dann soll das ja auch wie eine Liste aussehen. Dein CSS reicht völlig aus, das muss dafür nicht geändert werden.

Rolf