中心在THEAD，TR或TFOOT内对齐

Question

我正在使用网格 - 这是代码：

.grid-container
{
    margin:0 auto;
    width:96rem;
}

<div class="table-middle">
    <div class="grid-container">
        <p>This is some kind of widget with no SEO value</p>
    </div>
</div>

外部div允许我将背景绘制到页面边缘，而网格容器在中心对齐，最大宽度为96rem。

但我还需要改变3个div的顺序。我学到的技巧是使用这样的表格显示：

.table-top
{
    display:table-header-group;
}

.table-middle
{
    display:table-row-group;
}

.table-bottom
{
    display:table-footer-group;
}

这允许我将html以任何顺序放在父级中，并使用这些样式重新排序。

但是，我现在需要结合2 - 所以将内部div放在div的表行group insead中。

目前的班级不能一起工作，但我对表格一无所知。

任何帮助表示感谢。