我可以开始新行的CSS表格单元格没有行包装元素吗？ [英] Can I start new row of CSS table cells without a row wrapper element?

问题描述

给定标记如下：

 < div class =a> A< / div> 
< div class =b> B< / div> 
< div class =a> A< / div> 
< div class =b> B< / div> 
< div class =a> A< / div> 
< div class =b> B< / div> 
  

是否可以对此文档设置如下格式：

  | ------- | --------- | 
 | | | 
 | A | B | 
 | | | 
 | ------- | --------- | 
 | | | 
 | A | B | 
 | | | 
 | ------- | --------- | 
 | | | 
 | A | B | 
 | | | 
 | ------- | --------- | 
  

（如果A或B中的内容较长，其邻居将增长以匹配其高度） ...

没有任何额外的标记？

我理解给予 .a 和 .b a 显示

解决方案

/ div>

不是没有flexbox ，它尚未登陆到多个主要浏览器，似乎是一致的。

Given markup like this:

<div class="a">A</div>
<div class="b">B</div>
<div class="a">A</div>
<div class="b">B</div>
<div class="a">A</div>
<div class="b">B</div>

Is it possible to style this document to look like this:

|-------|---------|
|       |         |
|   A   |    B    |
|       |         |
|-------|---------|
|       |         |
|   A   |    B    |
|       |         |
|-------|---------|
|       |         |
|   A   |    B    |
|       |         |
|-------|---------|

(and if the content in A or B is longer, its neighbor will grow to match its height)…

without any additional markup?

I understand that giving .a and .b a display value of table-cell would just make this one big row.

What’s the solution?

解决方案

Not without flexbox, which hasn’t landed in several major browsers yet, seems to be the consensus.

这篇关于我可以开始新行的CSS表格单元格没有行包装元素吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！