Vergib der Navigation mal ne aussagekräftigere Klasse, z.b. mainnav.
Ja, du kannst dann den Selektor ".mainnav > ul" dort eingeben. Aber am einfachsten ist es, wenn du eine Datei erstellst
Code:
files/css/style.css
und den Code dort einfügst.
Die Datei kannst du dann im Layout auswählen, oder besser noch in die eigenen Head-Tags eintragen.
Code:
<link rel="stylesheet" href="files/css/style.css">
Ich empfehle dir diese CSS-Regel zu entfernen
PHP-Code:
* {
padding: 0;
margin: 0;
}
Für Navigationen allgemein dann diese Regel benutzen
PHP-Code:
.mod_navigation ul {
margin: 0;
padding: 0;
list-style: none;
}
/* und für deine Zentrierung */
.mainnav > ul {
display: flex;
}
.mainnav > ul > li {
flex-grow: 1;
text-align: center;
}
Bei deinem CSS kannst du dann einiges rausschmeißen. Klarer Anfängerfehler: "zuviel gemacht".
PHP-Code:
.mod_navigation.main {
width: 100%;
top: 355px;
position: absolute;
/* margin-right: auto; */
/* margin-left: auto; */
/* vertical-align: middle; */
/* text-align: justify; */
/* use linear-gradient for background */
/* background-image: url("../../files/theme_health-navigator/images/layout_images/navleiste_bg.png"); */
/* background-repeat: repeat-x; */
}
.mod_navigation.main ul {
/* text-align: center; */
}
.mod_navigation.main li {
/* overflow: auto; */
/* float: left; */
}
.mod_navigation.main li a,
.mod_navigation.main span {
/* min-width: 100px; */
display: block;
padding: .5rem;
/* vertical-align: middle; */
/* text-align: center; */
text-decoration: none;
}