nicht angemeldet
Hallo,
Ich behaupte, du müsstest hier ein bisschen pragmatischer denken.
<body>
<header></head>
<main></main>
<footer></footer>
</body>
main { max-width: 950px }
Problem gelöst. Funktioniert in jedem Browser. Kein Gerechne mit calc(), kein Verwenden von Einheiten, die die meisten Browser nicht oder falsch umsetzen.
Falls <main> hier nicht als Wrapper dienen kann (es hat schließlich eine bestimmte Semantik und es könnte noch weitere Sections daneben geben, etwa ein aside):
Und zwar war es mein Ziel möglichst viele unnötige Container-Divs zu entfernen.
UNNÖTIGE, ja. Wenn du mit dem div ein robusteres Layout umsetzen kann als ohne, dann setze es in Gottes Namen. Das div schadet nicht. Es sind sind nur ein paar Bytes. Dafür sind divs gedacht. Sie gruppieren Elemente ohne eine spezielle Bedeutung.
Dein Ansatz geht von hinten durch die Brust ins Auge (erst zentrieren, dann rückgängig machen…) und ist dementsprechend technisch fragil. Ich will nicht ausschließen, dass sich da etwas tricksen lässt. Ich würde das aber gar nicht weiter verfolgen. Am ehesten würde mir Flexbox mit vertikalem Stacking und horizontaler Zentrierung einfallen, aber damit handelst du dir genauso Kompatibilitätsprobleme ein.
Mathias
Gunnar Bittersmann