Da du anscheinend bereits irgendwo deinem Text Attribute verpasst hast (sonst wäre er wohl schwarz), könnte es sein, dass diese nicht überschrieben werden. Ein einfaches Beispiel:
Nehmen wir mal dieses HTML an:
Code:
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8">
<title>Hello World</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>
<p>Blabalbala</p>
</header>
<!-- weitere Inhalte -->
</body>
</html>
Dann könnte dein CSS z.B. so aussehen:
Code:
p {
text-align: left;
color: white;
}
header {
background-color: green;
color: black;
text-align: center;
}
header kann hier nicht überschreiben, was für
p festgelegt ist, da sich
p innerhalb von
header befindet und überschreibt, was in
header festgelegt ist (etwas simplifiziert, aber im Endeffekt läuft es darauf hinaus).
Anstelle von
p und
header kommen auch andere Elemente infrage (müsstest du gucken, was es bei dir ist). Das Problem ist also grundsätzlicher Natur. Besser formatiert man (nach Möglichkeit mit
div-Containern (wäre flexibler)) in Verbindung mit
class oder
id.
Eine etwas faule Lösung (weil sie zum Beispiel passt):
Code:
p {
text-align: left;
color: white;
}
header {
background-color: green;
}
header p {
color: black;
text-align: center;
}
Hiermit hätte sich das Problem erst gar nicht gestellt:
Code:
body {
text-align: left;
color: white;
}
header {
background-color: green;
color: black;
text-align: center;
}
Warum? Weil
header sich innerhalb von
body befindet und daher die Attribute, die in
body festgelegt sind, überschreibt. Dafür ist diese Variante fehleranfällig, für den Fall, dass du Elemente global spezifizierst, wie eben z.B.
p (der alte Fehler), was sogar ein Nachteil gegenüber der vorgenannten ist.
Also kombinieren wir:
Code:
body {
text-align: left;
color: white;
}
header {
background-color: green;
}
header p {
color: black;
text-align: center;
}
p {
text-align: right;
color: yellow;
}
Wie man sieht, werden die Attribute von
p nun innerhalb von
header überschrieben. Der Text innerhalb von
<p></p> ist nur außerhalb gelb und rechtsbündig ausgerichtet. Man kann also mit Selektoren auch die Schachtelung abbilden. Aber diese Lösungen sind nicht zum Nachahmen gedacht.
class sowie
id sind viel flexibler und robuster und daher normalerweise vorzuziehen.
Edit#3:
Übertragen auf dein Problem wäre also herauszufinden, wo ein Element global manipuliert wird (z.B. p) - und zwar vermutlich fehlerhaft, sodass es einmal abgekauft wird und einmal nicht.