0

別の div の中に 2 つの div があります。1 つの div を他の div とオーバーラップさせ、css idnex も使用したいのですが、これを行うことはできません。何らかの回避策はありますか?

このコードは他のブラウザでも動作するため、IE で表示してください。

ここに jsfiddle があります: http://jsfiddle.net/xkDCX/1/

そしてコード:

<div class="container">
    <div class="button"></div>
<div>


body{
    margin:50px;
}

.container{
    position:relative;
    width:410px;
    height: 300px;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#daf5fd', endColorstr='#0dbcf5');
    z-index:22;
}

.button{
    width:20px;
    height:20px;
    border:2px solid black;
    position:absolute;
    right:-10px;
    top:-10px;
    background:black;
    z-index:11;
}
4

1 に答える 1

1

ここでの問題は、追加したフィルターが IE でのみまったく機能しないため、他のブラウザーでスタイルを表示すると、まったく認識されないことです。

アップデート:

これでうまくいきましたか?

<div class="container">
    <div class="button">
      <div class="but"></div>
    </div>
    <div class="background"></div>
<div>

<style>
body{
    margin:50px;
}

.container{
    position:fixed;
    width:410px;
    height:300px;    
    margin:0;
    padding:0;   
}

.container .background{
    position:fixed;
    bottom:0px;
    left:0px;
    width:100%;
    height:100%;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#daf5fd', endColorstr='#0dbcf5');
    z-index: 50;
}

.container .button{
    position:absolute;
    width:410px;   
    margin-left:auto;
    margin-right: auto; 
    z-index: 100;  
} 

.container .but{
    position:absolute;
    width:20px;
    height:20px;
    background:black;
    right:-10px;
    top:-10px;
    border:2px solid black;
} 
</style>
于 2012-06-24T17:09:18.790 に答える