text-align Problem.

[Auge]

Hallo

Bei mir auf der Seite was in den gelben Kästen steht habe ich mit text-align: center; in die Mitte gesetzt. Nun möchte ich die Links die unter den Kästen sind links am Rand von dem roten Kasten positionieren und mit text-align: left; funktioniert das nicht.

<aside id="ligenlinks"> 
	<div id="ligen"> Ligen
	</div>
	<div class="alleligen">
	    <ul>
               <li><a href="liga1.html">Liga 1</a> </li>
	         <li><a href="liga2.html">Liga 2</a> </li>
	         <li><a href="liga3.html">Liga 3 </a>  </li>
	    </ul>
	</div>
</aside>

#ligenlinks		{
		text-align: left;
}

.alleligen		{
		text-align: left;
}

So funktioniert das natürlich und die Angabe von text-align: left; ist hier für .alleligen überflüssig. Wenn du aber, was deine Eingangsbveschreibung vermuten lässt, #ligenlinks { text-align: center; } angibst, wirkt .alleligen { text-align: left; } nicht. Das liegt an der Spezifität der Selektoren. Der ID-Selektor ist spezifischer als der Klassenselektor und seine Regeln überstimmen die für den Klassenselektor angegebenen Regeln.

Du kannst dem auf mehreren Wegen beimkommen.

1. Du erhöhst die Spezifität des Selektors, mit dem du .alleligen formatieren willst. Das geht mit der zusätzlichen Angabe der ID des Elternelements #ligenlinks .alleligen (höhere Spezifität von #id .klasse gegenüber den zu überschreibenden Regeln für #id). Solltest du aber die Klasse .alleligen noch außerhalb von #ligenlinks benutzen, wirkt der hier notierte Regelsatz dort nicht. Zudem bläht sich das CSS bei ausgiebiger Benutzung des Ansatzes auf.
2. Für diesen Fall überlegenswert wäre, für „alle Ligen“ eine ID statt der Klasse zu benutzen. Der Name .alleligen („alle Ligen“) lässt mich vermuten, dass es im HTML-Dokument ein Element für diese Zusammenfassung gibt. Wenn das so sein sollte, würde die Verwendung einer ID #alleligen dazu führen, dass die dafür notierten Regeln die für #ligenlinks überschreiben, wenn die Regeln für #alleligen nach denen für #ligenlinks notiert sind (gleiche Spezifität, die Reihenfolge der Notation entscheidet).

Tschö, Auge