<div> at the top of its container - html

Question

I need a div to be positioned at the top inside its containing div, and leave unused space below itself. The default behavior seems to be the opposite, e.g. the contained div falls down to the floor of its containing div and leaves unused space above itself.
I assume that's quite a trivial thing to do, but I don't even know how to search for the solution on Google (tried "div float top", "div gravity" and some other meaningless searches...)
Here is my html code:
<div class="bonus">
<div class="bonusbookmakerlogo">
<a rel="nofollow" href="http://..." target="_blank"><img src="/img/box.png" alt="blah" title="blah"/></a>
</div>
<div class="bonustext">
<span>Bonus description.</span>
</div>
<div class="bonusdivider"></div>
</div>
And relevant css:
.bonus {
font-size: 90%;
text-align: justify;
margin: 1em 2em;
}
.bonusdivider {
margin: 1em 0 1em 0;
border: none;
height: 1px;
color: #999999;
background-color: #999999;
}
.bonusbookmakerlogo {
display: inline-block;
width: 20%;
}
.bonustext {
display: inline-block;
width: 70%;
}
The resulting layout is ok except the logo div (the one containing the img tag) that occupies the lower part of its containing div free space, while I need it to "fight" gravity and stay with its top edge hooked to the container top edge.
Thanks in advance for any help.

Answer 1

Here is a slight modification using float instead of inline-block.
Seems to work OK:
<div class="bonus">
<div class="bonusbookmakerlogo">
<a rel="nofollow" href="http://..." target="_blank"><img src="/img/box.png" alt="blah" title="blah"/></a>
</div>
<div class="bonustext">
<span>Bonus description.</span>
</div>
<div class="bonusdivider"></div>
</div>
And CSS:
.bonus {
font-size: 90%;
text-align: justify;
margin: 1em 2em;
height: 100px;
border: 10px solid red; /* test */
}
.bonusdivider {
margin: 1em 0 1em 0;
border: none;
height: 1px;
color: #999999;
background-color: #999999;
clear: both;
}
.bonusbookmakerlogo {
float: left;
width: 20%;
}
.bonustext {
float: left;
width: 70%;
}

Answer 2

The answer by #Marius George works and I think it is the cleanest possible solution, but here his a different one I've found meanwhile:
.bonusbookmakerlogo {
display: inline-block;
width: 20%;
vertical-align: top;
}