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

ホームページ

ウェブフロントエンド

CSSチュートリアル

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

Patricia Arquette

Nov 03, 2024 am 05:12 AM

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 サイトの他の関連記事を参照してください。

このウェブサイトの声明

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

ホットツール

ホットトピック

Java チュートリアル

1664

CakePHP チュートリアル

1423

Laravel チュートリアル

1321

PHP チュートリアル

1269

C# チュートリアル

1249

Related knowledge

SASSをより速くするための概念の証明 Apr 16, 2025 am 10:38 AM

新しいプロジェクトの開始時に、SASSコンピレーションは瞬く間に起こります。これは、特にbrowsersyncとペアになっている場合は素晴らしい気分です。

静的フォームプロバイダーの比較 Apr 16, 2025 am 11:20 AM

ここでは、「静的フォームプロバイダー」という用語を埋めてみましょう。あなたはあなたのHTMLを持ってきます

毎週のプラットフォームニュース：HTMLロード属性、主なARIA仕様、およびIFRAMEからShadowDOMへの移動 Apr 17, 2025 am 10:55 AM

今週のプラットフォームニュースのラウンドアップで、Chromeは、Web開発者のロード、アクセシビリティ仕様、およびBBCの動きのための新しい属性を導入します

セクション要素との取引 Apr 12, 2025 am 11:39 AM

2つの記事がまったく同じ日に公開されました。

マルチサムスライダー：一般的なケース Apr 12, 2025 am 10:52 AM

この2部構成のシリーズの最初の部分では、2つの親指スライダーを取得する方法を詳しく説明しました。今、私たちは＆＃039; llが一般的なマルチサンプスのケースを見ていますが、別のものと

HTMLダイアログ要素を使用したいくつかの実践 Apr 16, 2025 am 11:33 AM

これは私が初めてHTML要素を見ていることです。私はしばらくの間それを知っていましたが、まだスピンしていませんでした。かなりクールです

Google Fontsをタグ付けし、Goofonts.comを作成する方法 Apr 12, 2025 pm 12:02 PM

Goofontsは、開発者妻とデザイナーの夫によって署名されたサイドプロジェクトであり、どちらもタイポグラフィの大ファンです。 Googleにタグを付けています

それはすべて頭の中にあります：Reactヘルメットを使用してReact Poweredサイトのドキュメントヘッドを管理する Apr 15, 2025 am 11:01 AM

ドキュメントヘッドはウェブサイトの中で最も魅力的な部分ではないかもしれませんが、それに入るものは間違いなくあなたのウェブサイトの成功にとってそれと同じくらい重要です

See all articles

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

ホットAIツール

Undresser.AI Undress

AI Clothes Remover

Undress AI Tool

Clothoff.io

Video Face Swap

人気の記事

ホットツール

メモ帳++7.3.1

SublimeText3 中国語版

ゼンドスタジオ 13.0.1

ドリームウィーバー CS6

SublimeText3 Mac版

ホットトピック