Twitter Bootstrap。删除列</div>中<div span =“”>元素之间的空格

时间:2012-06-11 11:07:15

标签: jquery css ruby-on-rails ruby-on-rails-3 twitter-bootstrap

我正在尝试使用ruby-on-rails在Twitter Bootstrap中以类似于pinterest的方式创建空缺职位(带有空位描述的无限5列墙)。

但是我有一个问题 - 行的元素之间有空格,就像这里: http://i.imgur.com/m9Z5U.png

我需要删除这些空格以显示连续画布。

我用来生成墙的代码:

<div class="row">
  <% @employer_vacancies.reverse.each do |employer_vacancy| %>
    <div class="span2 hero-unit left">
      <h2 style="margin-bottom:0px !important";> 
        <%= employer_vacancy.vacancy_title %>  
      </h2>     
      <br>
      <%= employer_vacancy.vacancy_description %>
     </div>
  <% end %>
</div>

我相信它可以通过JavaScript实现,甚至可以通过CSS实现。

2 个答案:

答案 0 :(得分:4)

如果列数是可变的,CSS无法执行此操作,并且您需要它可以在所有常见浏览器中使用。

相反,使用jQuery Masonry:http://masonry.desandro.com/

还有一个没有框架的版本,Vanilla Masonry:http://vanilla-masonry.desandro.com/

答案 1 :(得分:3)

看看jQuery Masonry