Konzeptionell werden CSS-Regeln auf die Elemente eines Dokuments in der Reihenfolge angewendet, in der sie im HTML erscheinen, d. H. In einer Vorreihenfolge des DOM-Baums. In der Vergangenheit war dies so, dass das CSS beim Laden des Dokuments angewendet werden konnte, aber selbst bei dynamischem HTML und dynamischem CSS gibt es Leistungsvorteile, wenn es möglich ist, das CSS in einem einzigen Durchgang anzuwenden.
Aus diesem Grund hat CSS keine Auswahlmöglichkeiten für "ein A gefolgt von einem B" oder "ein A, das ein B enthält", während man sagen kann "ein A mit einem B" oder "ein A in einem B ", weil in den letzten Fällen A vor B in einer Vorreihenfolge traversiert. Die vertikale Zentrierung ist schwierig, da zu dem Zeitpunkt, zu dem das CSS für das untergeordnete Element (das zu zentrierende Element) verarbeitet wird, die Höhen der übergeordneten und untergeordneten Elemente (die beiden Werte, die zur Berechnung des oberen Versatzes des untergeordneten Elements erforderlich sind) verwendet werden) sind nicht bekannt, da beide von noch nicht bearbeiteten Elementen abhängen.
Die Abhängigkeit von der Höhe des Elternelements wird durch absolute Positionierung überwunden: top: 50%. Dies verschiebt effektiv die Berechnung des vertikalen Versatzes, bis die Höhe des Elternelements bekannt ist.
Ähnlich können CSS3-Transformationen die Höhe des untergeordneten Elements berücksichtigen: transform: translateY(-50%). Vor CSS3 war es üblich, stattdessen die negative margin-top zu verwenden, aber das erforderte die Festlegung einer festen Höhe für das untergeordnete Element.
Ich gehe davon aus, weil der Browser die Breite der Seite leicht wissen kann, aber die Länge ändert sich je nach Inhalt. – imgx64
Das meine ich mit den Algorithmen - die Breite könnte auch dynamisch geändert werden, aber CSS hält weiter. Warum nicht für vertikale Veränderungen? – Ben