为什么 `width: auto` 不能按 `` 元素的预期工作？

宽度：的自动字段

在 CSS 中，块级元素的 width:auto 通常意味着宽度将扩展以填充可用空间。但是，此行为不适用于 。

width:auto 对 有何作用？

的默认大小属性是元素决定其初始宽度。 width:auto 只是将 的宽度设置为默认大小。

实现所需的行为

强制 要占用 100% 的可用宽度，请使用 width:100% 而不是 width:auto。但是，由于浏览器边框渲染的变化，这可能会遇到不一致的情况。

替代方法

填充 的可用宽度的另一种方法是删除size 属性并指定：

<code class="css">input {
  width: 100%;
  margin: -3px;
  border: 2px inset #eee;
}</code>

此方法消除了默认宽度并提供跨浏览器的一致行为。它从边距中减去 3 个像素来偏移边框的宽度和缩进。

以上是为什么 `width: auto` 不能按 `` 元素的预期工作？的详细内容。更多信息请关注PHP中文网其他相关文章！