This is really simple, yet I don't know how to solve this

```
<html>
    <body>
        <div style="width:500px; background:black;">
            <div style="display:inline-block; width:200px; height:300px; background:yellow;"></div>
            <div style="display:inline-block; vertical-align: top; width:100px; height:100%; background:pink;"></div>
        </div>
    </body>
</html>

```

Here's my fiddle : [Fiddle](http://jsfiddle.net/QG572/4/)

I want the pink div's height matches the black div's which is set auto.

Edit: actually I want to match the pink height to the yellow one so that the black's height matches the yellow's also.