検索

ホームページ >ウェブフロントエンド >CSSチュートリアル >ウィンドウ上の外側の「内側」がサイズ変更されないのはなぜですか?

ウィンドウ上の外側の「内側」がサイズ変更されないのはなぜですか?

Linda Hamilton
Linda Hamiltonオリジナル
2024-12-17 07:02:24844ブラウズ

Why Doesn't My Outer `` Fully Enclose My Inner `` on Window Resize?

なぜ外側の

は内側の
を完全に囲むことができませんウィンドウが狭くなったとき?

この問題は、さまざまな CSS プロパティと要素の表示設定の間の相互作用から発生します。デフォルトでは、

などのブロックレベルの要素は、それを含むブロックの利用可能な幅を満たすまで拡張されます。この場合、外側の

は

外側の

を防ぐには、より広いブロックを含むブロック内のブロック レベルの要素です。内側の

の幅未満に縮小しないように、inline-block プロパティと min-width プロパティの組み合わせを利用できます。説明は次のとおりです:
  • inline-block: この表示値により、特定の幅と高さを定義する機能を保持しながら、要素がインライン要素のように動作できるようになります。これにより、要素が新しい行に分割されるのを防ぎ、親要素内に要素が含まれるようになります。
  • min-width: 100%: 外側の が実行されるのを防ぎます。外側の
    の境界を越えてエスケープしないようにします。

    インラインブロック表示と min-width を組み込むことで、外側の

    を制限できます。内側の
    の幅を抱き締めます。ブロックレベルの動作を維持しながら。

以上がウィンドウ上の外側の「内側」がサイズ変更されないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

css define while default this display issue
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
前の記事：太字ホバー時のインライン要素の移動を防ぐにはどうすればよいですか?次の記事：太字ホバー時のインライン要素の移動を防ぐにはどうすればよいですか?

関連記事

続きを見る