Css 表格布局：修复了绝对100%宽度表格行内不展开表格单元格的问题（元素也不折叠）

这对我来说毫无意义，但话说回来，我与CSS专家（甚至可能不是一个好的新手）关系不大

我使用的是

relative

/

absolute

，因为我使用的是来自大型表的动态分页表。我这样做是为了允许用户快速浏览数据，而不会使客户端过载

，则

表行

扩展100%，但

表单元格

s不遵守

表布局：已修复

。需要展开

表格单元格

s以填充所有可用的

表格行

空间

（旁注，

边框折叠：折叠

也不起作用。）

请帮忙。非常感谢

HTML

<div class="gridTable">
    <div class="gridRow">
        <div class="gridCell">a</div>
        <div class="gridCell">JKL;</div>    
        <div class="gridCell">Jb</div>  
    </div>
</div>

---

我从行规则中删除了绝对位置，它对我有效（chrome、firefox）

如果您想要一个固定的标题，您可以像这样分开标题：

<div class="gridTableBox">
    <div class="gridTable gridHeaderTable">
        <div class="gridRow">
            <div class="gridCell">T1</div>
            <div class="gridCell">T2</div>
            <div class="gridCell">T3</div>
        </div>
    </div>
    <div class="gridTable gridBody">
        <div class="gridRow">
            <div class="gridCell">a</div>
            <div class="gridCell">JKL;</div>
            <div class="gridCell">Jb</div>
        </div>
    </div>
</div>

T1
T2
T3
A.
JKL；
Jb

现在，您可以在不破坏表格布局的情况下为gridHeaderTable div指定绝对位置

最新的小提琴是

也许你可以把“头”和“身”分开，就像那把更新过的小提琴一样：

.gridRow, .gridHeaderRow{
  display:table-row;
}

<div class="gridTableBox">
    <div class="gridTable gridHeaderTable">
        <div class="gridRow">
            <div class="gridCell">T1</div>
            <div class="gridCell">T2</div>
            <div class="gridCell">T3</div>
        </div>
    </div>
    <div class="gridTable gridBody">
        <div class="gridRow">
            <div class="gridCell">a</div>
            <div class="gridCell">JKL;</div>
            <div class="gridCell">Jb</div>
        </div>
    </div>
</div>