I'm trying to relocate a couple items on my page to fill up unused space on the page.

A float should be able to do the trick but for some reason they refuse to fill up the available space.

These items are placed inside the same direct parent.

```
<div class="image-div"></div>
<h1 class="title">title</h1>
<p class="description">Description</p>
<a class="download-link">download-link</a>

```

And have the following css.

```
.image-div {
     float: left;
     display: inline-block;
     width: 30%;
     margin-right: 5%;
     padding: 0;
}

.title,
.description,
.download-link {
    float: right;
    display: inline-block;
    width: 65%;
    margin: 0;
    padding: 0;
}

```

Am I missing something? Advice would be much appreciated.

Also if there's an alternative way to achieve the same result I'd love to hear it.

I have tried position: absolute; but this messes up the page when the image gets too tall or when the description isn't long enough.