为什么我的 Flex 容器的输入元素不缩小？

Flex 容器元素不收缩

当尝试在包含输入和按钮元素的 Flex 容器中使用 flex 和 flex-grow 时，预期可能不会发生调整大小行为。与 div 不同，此异常是由浏览器分配给输入元素的默认宽度引起的。

下面是描述浏览器自动宽度分配的片段：

在这种情况下，浏览器无论 Flex 设置如何，都为输入赋予设定的宽度。

请考虑以下事项：

input {
  border: 1px solid blue;
  display: inline;
}

div {
  border: 1px solid red;
  display: inline;
}

在提供的代码片段中，输入元素保留其默认宽度，而div 会适应弹性容器的尺寸。

以上是为什么我的 Flex 容器的输入元素不缩小？的详细内容。更多信息请关注PHP中文网其他相关文章！