小编Pio*_*otr的帖子

如何将2个相对div放在彼此/ top css属性上不同的浏览器,css所以它们在所有浏览器中显示相同?

我有以下div元素:

<div id="banner1">   
    <div id="whiteout"></div>
    <div id="banner2"></div>    
</div>
Run Code Online (Sandbox Code Playgroud)

我需要:'whiteout'元素直接出现在'banner1'和'banner2'之上,并且在所有浏览器中显示相同的内容(目前Firefox和IE似乎很难正确地显示它,即使'顶部' 'css属性是以像素为单位) - 或者,有人可以告诉我如何在彼此之间显示2个相对div吗?

目前,我的css如下:

div#banner1 {    
    width: 100%;
    height: 140px;
    background-image: url( "images/banner/1.png" );
    background-position: center center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    border-collapse: collapse;    
}

div#banner2 {   
    width: 100%;
    height: 140px;
    background-position: center center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    border-collapse: collapse;    
}

div#whiteout {    
    border: 1px solid black;
    width: 500px;
    height: 140px;
    background-image: url( "images/whiteout.png" );
    background-position: left center;
    background-repeat: no-repeat;
    border-collapse: collapse;
    position: absolute;
    z-index: 1;
    display: block;
    top: 50px; …
Run Code Online (Sandbox Code Playgroud)

html css position z-index

6
推荐指数
1
解决办法
2万
查看次数

标签 统计

css ×1

html ×1

position ×1

z-index ×1