| <!DOCTYPE html> |
| <style> |
| #container { |
| width: 400px; |
| text-align: right; |
| font: 50px/1 Ahem, sans-serif; |
| -webkit-font-smoothing: antialiased; |
| color: rgba(0, 255, 0, 0.5); |
| } |
| |
| #shape1 { |
| float: right; |
| width: 200px; |
| height: 100px; |
| background-color: blue; |
| } |
| |
| #shape2 { |
| clear: right; |
| float: right; |
| width: 100px; |
| height: 100px; |
| background-color: blue; |
| } |
| </style> |
| |
| <p>The green rectangles should wrap around the left edge of the blue shape.</p> |
| <div id="container"> |
| <div id="shape1"></div> |
| <div id="shape2"></div> |
| X<br>X<br>X<br>X<br>X |
| </div> |