オーバーフローしたコンテンツに合わせてフィールドセットのサイズが変更されないのはなぜですか?

<フィールドセット>最小幅制約によるサイズ変更の問題

問題:

要素にオーバーフローしたコンテンツが含まれている場合、要素の幅が期待どおりにサイズ変更されません。

原因:

デフォルトでは、

要素には min-content という最小幅制約があり、コンテンツの固有の幅より狭くなることはありません。

修正:

このデフォルトの動作をオーバーライドするには、min-width: 0; を設定できます。

で。ただし、これは WebKit と Firefox 53 でのみ機能します。

Gecko 固有の回避策:

Firefox の以前のバージョンでは、< の表示プロパティを追加で設定できます。 ;フィールドセット>次のいずれかの値に設定します:

• table-cell (推奨)
• テーブル列
• テーブル列グループ
• テーブルフッター-gr oup
• table-header-group
• table-row
• table-row-group

は@-moz-document 安全ですか?

この特定の問題については、@-moz-document を使用して Gecko 固有の回避策を他のブラウザーから隠すことが正当化されます。ただし、Firefox をターゲットにするために @-moz-document を使用することは通常推奨されません。

JavaScript 解決策:

WebKit と Firefox 以外のブラウザをサポートする必要がある場合53 では、JavaScript を使用して

の幅を手動で設定できます。

以上がオーバーフローしたコンテンツに合わせてフィールドセットのサイズが変更されないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。