IE6 および IE7 の「position:relative」「ul」で「overflow:hidden」が機能しないのはなぜですか?-CSSチュートリアル-php.cn

IE6 および IE7 の「position:relative」「ul」で「overflow:hidden」が機能しないのはなぜですか?

Patricia Arquette

リリース： 2024-11-03 05:12:02

オリジナル

204 人が閲覧しました

Why Does `overflow: hidden` Not Work on a `position: relative` `ul` in IE6 and IE7?

IE6 IE7 CSS 問題: Overflow: Hidden が Position: Relative で機能しない

この問題は、overflow: hidden; を使用するときに発生します。 IE6 および IE7 のスライダー内の非アクティブなスライドを非表示にします。オーバーフロープロパティは、position:relative; を持つ ul 要素に適用すると機能しません。その上に設定します。この障害により、要素が正しく隠蔽されなくなります。

提供された HTML コードを調査すると、その位置が明らかになります。は実際に ul 要素に適用されます。ただし、これは、コンテンツをスライドさせるために ul の left 属性を調整することに依存するスライダーの JavaScript 機能に必要です。

解決策:

これに対する解決策問題は、IE6 と IE7 の既知のバグを理解することにあります。このバグを克服するには、position:relative; を追加します。 ul 要素のコンテナに追加します。提供されたコードでは、本体がコンテナーです。したがって、推奨される修正は、本文の直下に div を追加し、position:relative; を適用することです。

修正を説明するには:

<code class="html"><body>
  <div style="position: relative;">
    <!-- Slider code here -->
  </div></code>

ログイン後にコピー

この追加の div を位置:相対で追加します。コードのオーバーフロー: 非表示。 ul 要素のプロパティは IE6 および IE7 で正しく機能し始め、非アクティブなスライドを期待どおりに非表示にできるようになります。

以上がIE6 および IE7 の「position:relative」「ul」で「overflow:hidden」が機能しないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。