16

別の絶対位置のdiv内に絶対位置のdivがあります。子のdivコンテンツは、親が含めることができるよりもはるかに大きくなります。これは仕様によるものです。親からこぼれるように子divが必要です。これは、IE 8を除く他のすべてのブラウザーで行われます（IE 7は問題ないように見えますが、よくわかりません）。IE8では、親の外にある子の部分がクリップされます。そこにありますが、IE開発者ツールで確認できるように表示されません。私はz-indexを試し、overflow：visibleを明示的に設定しようとしましたが、まったく運がありませんでした。

更新：この問題は、次のように親divで定義されたフィルターが原因であることがわかりました。

-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#66C6DEA2,endColorstr=#66C6DEA2)";

誰かがそれを回避する方法を知っていますか？

4

3 に答える 3

4

これを使用して解決しましたInternet Explorer の適切な勾配フィルターが、オーバーフローする必要があるコンテンツを遮断しないようにするにはどうすればよいですか?

私の解決策は少し変更されています。透明にしたいコンテナ内にクラス "ie_rgba_fix" を持つ空の div を配置するだけで、この CSS を IE 固有の場所に追加すると、オーバーフローのように子がクリップされなくなります。

/* IE8 RGB A workaround */
div.ie_rgba_fix
{
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: transparent;
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#66C6DEA2,endColorstr=#66C6DEA2)";
}
于 2010-09-27T11:25:53.110 に答える
1

絶対位置の要素内に要素を作成するposition:relativeか、その絶対位置の要素内のすべての要素の周りにラッパーを追加して、それを相対化してみてください。

于 2010-09-26T23:27:24.893 に答える
0

ここでチェックされた回答とリンクされた質問からヒントを得ましたが、空の DIV を使用したくありませんでした (特に、他のブラウザーでは必要ないため)。

:before代わりに、コンテナー DIV の疑似要素を使用する IE8 固有の CSS をセットアップします。

ただし、疑似要素はDOM オブジェクトではなくスタイル設定された content-ms-filterであるため、このプロパティは役に立ちません。妥協するには、必要な元のフィルター (実際にはdata:URL ですが、どちらでも機能します) に一致する PNG をbackground-image.

疑似要素をコンテナのフルサイズに強制し、絶対位置に配置し、子要素は親の外側に表示され、親は引き続き透明な背景を取得します。

.container.ie8 {
    background-color: transparent;
    position: relative;
}
.container.ie8:before {
    background-image: url("data:image/png;base64,...");
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
于 2013-10-28T20:26:00.810 に答える