Html 输入和div替换内联项

出于某种原因，当组合使用div和input时，下一个

内联

项将被替换。见下面的例子

div.inline-flex{
显示：内联flex；
}

对象控件：
捕捉到栅格大小：
（默认值：50）
断裂
去除

我不确定是否得到了您想要的输出，但我想是这样的

div.inline-flex{
显示：内联flex；
}

对象控件：
捕捉到栅格大小：
（默认值：50）
断裂
去除

您正在将内联设置为“（默认值：50）”而不是“对齐网格”。如果将“（默认值：50）”的声明移动到末尾，则按钮将以内联方式显示为“捕捉到网格”

div.inline-flex{
显示：内联flex；
}

对象控件：
捕捉到栅格大小：
断裂
去除
（默认值：50）

您可以执行

垂直对齐：顶部

来快速修复它

  div.inline-flex {
    display: inline-flex;
    vertical-align:top;
}

---

现在看起来像我想要的，我会仔细看一看，并根据需要做标记。不，答案不太正确，看起来它只是为了让它工作。我需要它作为一个单独的块，因为它有更多的内容。哦，好的。。明白了，让我想想我真的在寻找一个解释。我已经用flexbox解决了这个问题，但我只是想知道为什么它会被替换成这样。你改变了我的布局，虽然我认为你希望所有的东西都在一行中，而不仅仅是删除按钮。请看第二个代码段。我的

删除

按钮位于另一个容器中的原因是因为其中有更多的项目。