html - 结转表到新行

Question

我有一个表格，每个单元格都包含其他表格。我想知道的是，当屏幕上没有新列的空间时，如何使表格开始新行。这是我的 show.html.erb：

<table border="1">
    <tr>
        <% @photos.each do |photo| %> 
            <td>
                <table border="1">
                    <tr>
                        <td><%= photo.author %></td>
                    </tr>
                    <tr>
                        <td><%= photo.title %></td>
                    </tr>
                    <tr>    
                        <td><%= photo.link %></td>
                    </tr>    
                </table>
            </td>    
        <%end%>
    </tr>    
</table>            

Answer 1

有许多不同的屏幕分辨率，通过显示 x 列来设置它，对于其他用户来说看起来会有所不同。CSS 在解决这个问题方面可能比 ruby​​ 更好（也更简单）。创建左浮动 div，当行空间不足时，它将自动下降到新行。

.gallery_column {
  float: left;
  width: 150px;
  border: 1px solid;
}

<div class='gallery_column'>
  <% @photos.each do |photo| %> 
        <table border="1">
            <tr>
                <td><%= photo.author %></td>
            </tr>
            <tr>
                <td><%= photo.title %></td>
            </tr>
            <tr>    
                <td><%= photo.link %></td>
            </tr>    
        </table>
  <%end%>
</div>