TW Bootstrap :Как переполнить столбцы

Я хочу иметь строку, в которой столбцы будут прокручиваться по горизонтали:

scrollable columns in a single row in twitter bootstrap

Как видите, строка — это внешний блок (с отступом ). Внутри него есть столбцы, каждый из которых имеет некоторый класс span*, например span3. А так как все столбцы не помещаются в строку, полоса прокрутки находится внизу.

Вот что я пытался сделать (со встроенным css ), и пока безуспешно.

<div class="row">

<!-- the parent element which will have scrollbar -->
<div class="span12" style="white-space: nowrap; overflow-x: auto;">

<div class="row">

<div class="span3" style="display: inline-block;">content here</div>
<div class="span3" style="display: inline-block;">content here</div>
<div class="span3" style="display: inline-block;">content here</div>
...

<div>

</div>

</div>

Но тогда столбцы просто переносятся, как только они не могут вписаться в строку. Как я могу это сделать?

Спасибо.

12
задан miki725 3 July 2012 в 22:54
поделиться