CSS Tipp | Beispiel1 | Beispiel2 | Beispiel3 | Beispiel4
<main> <section>Section</section> <section>Section</section> <section>Section</section> </main> <footer>Footer</footer>
Hintergrundfarbe von main ist türkis, Hintergrundfarbe von footer ist beige.
Die Sections im main werden mit float: left versehen und sind somit für das umgebende main unsichtbar. Da im main kein weiteres Element vorhanden ist, sieht man es auch nicht. Stattdessen sieht man die Hintergrundfarbe des Footers, die sich bis nach oben zum Anfang oder Ende des main erstreckt. weiter
main, section, footer{box-sizing:border-box; border:1px solid #000;}
main{background-color:#57D8D2;}
footer{background-color:#FCD277;}
section{width:33%; min-height: 100px; float:left;}