サムネイルが2段目からずれる Twitter Bootstrap

※ [追記] 以下、IEでは動きません。IEでも対応したい場合はこちらを参照くださいませ。

先日からBootstrapをいじっております。
サムネイル(thumbnail)を試しているのですが、2段目から左端がずれてしまうのです。

<ul class="thumbnails">
  <% @images.each do |image| %>
    <li class="span3">
      <a href="<%= image_path(image) %>" class="thumbnail">
	<h3>サムネイル</h3>
      </a>
    </li>
  <% end %>
</ul>

結果がこんな感じ。

調べてみると、みなさま色々な方法で回避されています。
margin-leftの値が、一番最初だけしか0になっていないことが問題なようです。
一番簡単そうなこの方法で行くことにしました。

cssに以下を追加。

ul.thumbnails li.span3:nth-child(4n + 1) {
    margin-left : 0px;
}

この例では1つのボックスの幅を"span3"にしているので(上記html参照)、cssでもspan3を指定しています。
"4n+1"の部分ですが、一段に入るボックスの数に合わせてnの前の数字を変えて下さい。

例えばボックスの幅を"span2"にする場合、一段に6個のボックスが入るので、下記のようになります。

ul.thumbnails li.span2:nth-child(6n + 1) {
    margin-left : 0px;
}

うまくいきました。