css - Rails/bootstrap - 尝试在跨度内居中元素，但在缩小视口时跨越中心

Question

我正在容器中的一组跨度中显示条目。我想要一个图像和几行文本以跨度为中心。这工作正常。当我减小窗口的水平尺寸时，所有跨度都在容器的中心排列。有没有办法防止这种情况发生。这是代码：

<div class="well" style="padding-bottom:20px">
<div class="container">
<% @novels.each do |novel| %>
    <div class="span3">
        <div align="center"><%= link_to image_tag(novel.cover_thumbnail_url), novel %>
        <br />
        <%= link_to novel.name, novel%><br />
        <%= novel.edition %>
        </div>
    </div>
<% end %>
</div>

谢谢。

Answer 1

我对他们的症状有点模糊，但也许这会有所帮助。

您是否尝试将整个语句包装在中心或使用 style="margin:0 auto" 因为 center 已弃用

[div style="margin:0 auto"]你的内容在这里[/div]

Answer 2

我不确定这是否是你想要的？

注意 each_slice 的使用，这将导致 span4 内每行有 3 行记录

<div class="well" style="padding-bottom:20px">
  <div class="container">

    <% @novels.each_slice(3) do |set| %><!-- NOTE: each_slice -->
      <div class="row">

        <% set.each do |novel| %>
          <div class="span4">
            <div style="text-align:center">
              <%= link_to image_tag(novel.cover_thumbnail_url), novel %>
              <br />
              <%= link_to novel.name, novel %>
              <br />
              <%= novel.edition %>
            </div><!-- end center -->
          </div><!-- end span4 -->
        <% end %><!-- end set.each -->

      </div><!-- end row -->
    <% end %>

  </div><!-- end container -->
</div><!-- end well -->

您可能想要清理它以使用部分，使其更容易查看