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