Как сделать текущую «временную шкалу» в Bootstrap

Question

Я пытаюсь сделать текущую «временную шкалу», подобную строке в Bootstrap. См. Пример того, что я ищу here (в основном ряд ящиков, которые складываются независимо от высоты).

Я пытался использовать этот большой шаблон: http://codepen.io/emaildano/pen/LEbLeQ Код:

<section class="grid-container"> 
    <div class="grid"> 
    <a href="#"><div class="item i1"><span class="date">2015</span><p class="title">Content</p></div></a> 
    </div> 
</section> 

Но это не работает для меня на моем сайте. Они складываются только на одну строку вместо двух. Точно так же:

Спасибо!

EDIT: Я также сделал PSD для него, и думал, что это может выглядеть следующим образом:

Однако, проблема в том, что я не знаю, как сделать это в Bootstrap.

Answer 1

Просто установите width к 100% вместо 1000px

.grid-container { 
    position: relative; 
    width: 100%; 
    margin: 0 auto; 
    overflow: hidden; 
    transition: all 0.5s; 
    -webkit-transition: all 0.5s; 
} 

http://codepen.io/anon/pen/qdqWBX