`width: auto` が ` 要素に対して期待どおりに機能しないのはなぜですか?

width:auto (<input>)フィールド

CSS では、ブロックレベル要素の width:auto は通常、幅が拡張されて利用可能なスペースを満たすことを意味します。ただし、この動作は <input> には当てはまりません。

width:auto は <input> に対して何をしますか?

<input> のデフォルトのサイズ属性です。要素はその初期幅を決定します。 width:auto は、<input> の幅をデフォルトのサイズに設定するだけです。

望ましい動作を達成する

<input> を強制するには使用可能な幅の 100% を占めるには、width:auto の代わりに width:100% を使用します。ただし、これは、ボーダーレンダリングのブラウザのバリエーションのために矛盾に遭遇する可能性があります。

このアプローチにより、デフォルトの幅が削除され、ブラウザー間で一貫した動作が提供されます。マージンから 3 ピクセルを引いて、境界線の幅とインデントをオフセットします。

以上が`width: auto` が ` 要素に対して期待どおりに機能しないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。