Question

Currently the list item # appears on the right. If you remove the float from the document-export-icon class, the list item # appears correctly on the left but the title and date are moved to the next line. I need them to be on the same line as the export icon.

Here’s what I have so far: http://jsbin.com/owanod/2/edit#source

Here’s how it should look:

Answer 1

I added these three CSS rules to your example:

.document-export-icon, .document-title-separate, .document-date {
    display: inline-block;
}
.document-date {
    position:absolute;
    right:0px;
}
.document-wrapper {
    position:relative;
}

jsFiddle example.