html - 在 CSS 表格容器内，如何通过仅触摸其 CSS 将单个表格单元格移动到下一行？

Question

我有以下 HTML:

<div class='container'>
  <div class='first'>test</div>
  <div class='second'>test</div>
</div>

附有以下CSS:

.container {
  display: table;
  width: 90%;
  background: yellow;
}

.first {
  display: table-cell;
  background: red;
}

.second {
  display: table-cell;
  background: blue;
}

(也:http://codepen.io/zssz/pen/GodBqQ)

如何通过仅更改 .second 的 CSS，使第二个/蓝色 div 位于第一个/红色 div 的正下方？

谢谢

(在这种情况下我无法控制容器 CSS)

Answer 1

你可以这样做:

CSS

.second {
  display: table-row;
  background: blue;
}

DEMO HERE