.html.erb set div无法正常工作

Question

我刚刚在rails中创建了scaffold并列出了索引页中的所有stories，_stories.html.erb是部分的，在index.html.erb

中呈现

我希望每个故事div都有一个红色背景，例如：

.storyCell{
    background-color:red;
    height:100px;
}

_stories.html.erb

<tbody>
        <% @stories.each do |story| %>
        <div class="storyCell">
          <tr>
            <td><%= story.content %></td>
            <td><%= story.finished %></td>
            <td><%= link_to 'Show', story %></td>
            <td><%= link_to 'Edit', edit_story_path(story) %></td>
            <td><%= link_to 'Destroy', story, method: :delete, data: { confirm: 'Are you sure?' } %></td>
          </tr>
        </div>
        <% end %>
      </tbody>

但结果是红色div全部位于故事模型属性的顶部。谢谢！

Answer 1

这是无效的HTML。你不能在tbody里面有一个div。删除你的div，只需将类直接放在表格行上：

<tr class="storyCell">

这里发生的事情是浏览器正在尽力渲染无效的html，因此它会拉出div（它在表中不允许这样）并将其呈现在上面而是表。

Answer 2

您可以将课程提供给<tbody>，如下所示：

<tbody class="storyCell">

以下是您可以查看的w3schools示例：http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_tbody 。你不能在表格元素中插入div，因为它会在正确的html输出中呈现。