Chrome [重复]出现网格列问题>>

Question

此问题已经在这里有了答案：

Flexbox not working on button or fieldset elements（2个答案）

关闭3分钟前

。

我正在尝试在表单元素内设置多列网格：

    fieldset#size-sub {
    padding: 0;
    display: grid;
    grid-auto-flow: column;
    /*grid-auto-rows: 100px;*/
    }
    #size-sub div {
    grid-row: auto;
    grid-column: auto;
    }
 <fieldset id="size-sub"><legend>Size</legend>
      <div id="group-1"></div>
      <div id="group-2"></div>
      <div id="group-3"></div>
      <div id="group-4"></div>
      <div id="group-5"></div>
    </fieldset>

每个div元素封装了一些文本类型的输入字段（边框样式和100％宽度）。上面的代码可以在Firefox中正常工作，但是在Chrome中，div元素彼此堆叠，就好像根本没有样式一样。我尝试添加“网格自动行”值，但没有帮助。

我想念什么？

我正在尝试在表单元素内设置多列网格：fieldset＃size-sub {padding：0;显示：网格； grid-auto-flow：列； / *网格自动行：100px; * /} ...

Answer 1

用div替换字段集并相应地修改CSS后解决了布局问题。