我的 CSS 网格表的列宽度不同,我想使用 CSS 网格复制表结构。
我之所以使用grid-auto-flow: column;,是因为在我的应用程序中,单元格是动态生成的,并且数量会有所不同。
代码: https: //jsfiddle.net/w8sdvnr7/1/
div {
display: grid;
grid-auto-flow: column;
}
p {
border: 1px solid red;
margin: 0;
}
table {
border-collapse: collapse;
}
td {
border: solid 2px red;
}Run Code Online (Sandbox Code Playgroud)
<h3>Not working: CSS Grid: The cells in the rows have different size.</h3>
<div>
<p>ABC</p>
<p>A</p>
<p>ABCDEFGHIJKLMNOP</p>
</div>
<div>
<p>ABCDEFGHIJKLMNOP</p>
<p>A</p>
<p>AB</p>
</div>
<hr>
<br>
<hr>
<h3>What I want: CSS Table: The cells in the rows have same size.</h3>
<table> …Run Code Online (Sandbox Code Playgroud)