html-divs position to relative

Question

我有一個問題： 有3個divs。其中2個應該有他們的背景圖像，他們的位置是在用戶區域的兩側。 （一個在右邊，一個在左邊）。第三個div應該超過它們和全角。 我怎樣才能做到這一點與CSS？

Answer 1

使這兩個div或第三個div絕對定位。給第三個div分配一個高於其他兩個的z-index。

（好吧，就說說CSS可以去沒有先例）

---

<style> 
    div.holder-for-left-and-right 
    { 
    width: 100%; 
    overflow: hidden; 
    position: relative; 
    } 

    div.left 
    { 
    float: left; 
    width: 100px; 
    height: 50px; 
    background: url(...) no-repeat; 
    z-index: 1; 
    } 

    div.right 
    { 
    float: right; 
    width: 100px; 
    height: 50px; 
    background: url(...) no-repeat; 
    z-index: 1; 
    } 

    div.on-top-of-them 
    { 
    position: absolute; 
    top: 0; 
    width: 100%; 
    height: 50px; 
    z-index: 2; 
    } 
    </style> 

<div class="holder-for-left-and-right"> 
    <div class="left">I am leftM</div> 

    <div class="right">I am right</div> 

    <div class="on-top-of-them">I am over them</div> 
</div>