Выровнять один из трех элементов справа

Question

Мой вопрос немного похож на этот: CSS: alight left and right within the same line (without floats)
Разница в том, что у меня есть 3 элемента в строке (дата, название, автор), и я хочу, чтобы автор был выровнен правильно.

Вот JSFiddle с частью решения. Проблема в том, что в моей скрипте автор позиционируется абсолютно, поэтому, уменьшив окно, вы увидите, что в какой-то момент название будет перекрывать автора.

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

TL; DR: Могу ли я выровнять один из трех элементов в самом правом без поплавков и/или дополнительных HTML элементов?

Answer 1

Вы можете использовать Flexbox для этого.

Комплект display:flex на вашем <li> и margin-left: auto на .e-author.

Вот обновление к вашей скрипкой: http://jsfiddle.net/dtqkm2sk/3/

Zoe Gillenwater имеет очень глубокий talk on CSS Flexbox, который покрывает этот и многие другие случаи использования.