Placing an image to the top right corner - CSS

Question

I need to retain the current text enclosed in an internal div, sort of attached to the top of it, while displaying an image on the top-right corner of a div (the picture is a "diagonal" ribbon).

I experimented with many methods, such as adding the image to another div or declaring its class as:

.ribbon {
   position: relative;
   top: -16px;
   right: -706px;
}

<div id="content">
   <img src="images/ribbon.png" class="ribbon"/>
   <div>some text...</div>
</div>

but without success. The optimal outcome was all the text scrolled down to match the image's height.

Any idea?