JSFiddle - React, Tailwind, and code Playground

HTML

<main>
    <ul class="entries">
        <li>
            <span class="e-date">01.10.2015</span>
            <a class="e-title" href="#">
                The title. But if this gets too long, it covers the author and your can't read it
            </a>

            <a class="e-author" href="#">author</a>
        </li>
        <li>
            <span class="e-date">01.10.2015</span>
            <a class="e-title" href="#">
                The title. But if this gets too long, it covers the author and your can't read it
            </a>

            <a class="e-author" href="#">author</a>
        </li>
    </ul>
</main>

CSS

ul {
    list-style: none;
    padding: 0;
}

main {
    display: block;
    position: relative;
}

.entries li {
    border-bottom: solid 1px #b9b9b9;
    padding: .5em 0;
}

.e-author {
    position: absolute;
    right: 0;
}