| <html><head> | |
| <style> | |
| #maincontent { | |
| width:500px; | |
| float:left; | |
| background-color:red; | |
| } | |
| .leftchunk { | |
| float:left; | |
| background-color:orange; | |
| width:250px; | |
| height:300px; | |
| } | |
| .rightchunk { | |
| float:left; | |
| background-color: red; | |
| } | |
| #child1 { | |
| width:250px; | |
| float:left; | |
| height:40px; | |
| background-color: yellow; | |
| } | |
| #child2 { | |
| float:left; | |
| clear:left; | |
| width:250px; | |
| height:260px; | |
| background-color: olive; | |
| } | |
| </style> | |
| </head> | |
| <p>You should see a 500x300 rectangle with orange, yellow and olive rects. No red should be visible or the test has failed. | |
| </p> | |
| <div id="maincontent"> | |
| <div class="leftchunk"></div> | |
| <div class="rightchunk"> | |
| <div id="child1"></div> | |
| <div id="child2"></div> | |
| </div> | |