ホームページ > ウェブフロントエンド > CSSチュートリアル > Firefox でフィールドセットのサイズ変更の問題を解決するにはどうすればよいですか?

Firefox でフィールドセットのサイズ変更の問題を解決するにはどうすればよいですか?

Barbara Streisand
リリース: 2024-11-14 22:23:02
オリジナル
307 人が閲覧しました

How to Fix the Fieldset Resizing Issue in Firefox?

<フィールドセット>サイズ変更の問題とその修正方法

問題:

特定のブラウザ (特に Firefox) の要素は、含まれている要素の幅が縮小されると、その幅を縮小できません。これにより、水平スクロールバーが発生し、親コンテナ内に不適切に収まります。

根本原因:

デフォルトでは、フィールドセットには最小幅「min-content」が適用されます。彼らに。これにより、CSS で設定した最大幅ルールや幅ルールをオーバーライドできます。

解決策:

s を適切に拡大縮小できるようにするには:

  1. WebKit と Firefox 53 :

    • 最小幅を設定: 0;フィールドセットでデフォルト値を上書きします。
  2. Firefox 53 より前:

    • Set min-width: 0 ;
    • フィールドセットの表示プロパティを次のいずれかに変更します: table-cell、table-column、table-column-group、table-footer-group、table-header-group、table -row、または table-row-group。

    推奨値: table-cell

ブラウザの互換性:

  • 初期の問題は Firefox 53 以降で修正されました。
  • @-moz-document を使用した提案された解決策は、この問題に関しては廃止されましたが、古いバージョンのFirefox.

注意:

この特定の問題以外では、CSS で Firefox をターゲットにするために @-moz-document を使用しないでください。ブラウザ固有のスタイルを実現するためのより良いアプローチが登場しました。

以上がFirefox でフィールドセットのサイズ変更の問題を解決するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート