| <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> |
| |
| |
