2011-12-17 14 views
24

私のウェブサイトでは、CSSのプロパティoverflow: overlay<div>に使用する必要があります。オーバーフロー:ファイアウォールでオーバーレイが機能しない

しかし、ブラウザではレンダリングされていないため、Firebugのcssを調べると、そこには存在しないことが示されますが、Chromeでは動作しています。私はサファリを試していない。

overflow: overlay CSSプロパティを有効にするにはどうすればよいですか?オーバーフローのため

おかげ

+0

「オーバーフロー:可視」を意味しますか? –

答えて

31

可能な値は以下のとおりです

visible 
hidden 
auto 
scroll 

は、これらの議論のためherehereを参照してください。

異なるブラウザで別の値を使用すると、不正確な値を異なる方法で処理するため、予測できない結果が生じます。

編集:コメントに続いて、オーバーフローの説明を見つけることができました:オーバーレイhere

オーバーレイは次のように説明されています

コンテンツはクリップされ、必要なときにスクロールバーが追加されます。

重要なことに、SafariやChrome(WebKitなど)でも動作すると言われています。 WebKitのBugzillaの上

This itemそれはどのような場合には、この世界のために長くはないお勧め:

のWebKitは現在、私の知る限りは、読書から言うことができるように文書化されていないで、「オーバーレイ」と呼ばれる独自のCSSのオーバーフロー値を持っていますコードは "auto"と全く同じように動作します。

名前を削除するか、名前を「-webkit-overlay」に変更する必要があります。

アップデート2016年3月

overflow: overlayが離れて行っておりませんように見えます。それが基準への道のりであることの兆候があります。

overlayautoの違いは、スクロールバーがページコンテンツの上部に表示され、レイアウトスペースを取らないことだけです。

here for the discussionを参照してください。

+0

オーバーレイは、Autoと同じ働きをします。 (スクロールバーは必要に応じて追加されます) –

+48

違いがあります: 'auto'では、x-overflowの要素の下にスクロールバーが追加されます。オーバーレイでは、要素内に追加されます!つまり、追加のスクリーンプロパティは使用されませんが、要素内のテキストはスクロールバーによって遮られます。これは微妙だが有用な違いだ。クロムについて試験した。 – ypnos

+2

"overflow:overlay"は "overflow:auto"と同じではありません。スクロールバーに幅を与えてスタイルを設定すると、これらのプロパティの両方が異なる効果を持ちます。オーバーレイの場合、スクロールバーは内容の上に浮かび、通常のドキュメントフローにないため、コンテンツを押し込むことはありません。しかし、 "overflow:auto"の場合、スクロールバーはある幅を占め(あなたの指定どおり)、流入要素のように内容をプッシュします。 – maverick

関連する問題