Artikel sebelumnya mengenai latar belakang di sisi kiri-kanan Wrapper. Lalu bagaimana jika kita ingin meletakkan latar belakang iklan persis di sisi kiri-kanan browser?

Berikut caranya:

CSS:
*{
    margin: 0;
    padding: 0;
}

body{
    background-color: white;
}

#wrapper{   
    width: 900px;
    margin: auto;
    background-color: grey;
    min-height: 1600px;
    position: relative;
}

#iklan_kiri{   
    position: absolute;
/* posisi iklan mengikuti scroll up-down*/
    left:0px;
    z-index: 99999;
    clip:inherit;
    top: 50px;
    _top:expression(document.documentElement.scrollTop+document.documentElement.clientHeight-this.clientHeight);
    _left:expression(document.documentElement.scrollLeft+document.documentElement.clientWidth – offsetWidth);
}

#iklan_kanan{   
    position: fixed;
/* posisi iklan tetap terhadap browser, tidak bergerak walau ada scroll up-down*/
    right:0px;
    z-index: 99999;   
    clip:inherit;
    top: 50px;
    _top:expression(document.documentElement.scrollTop+document.documentElement.clientHeight-this.clientHeight);
    _left:expression(document.documentElement.scrollLeft+document.documentElement.clientWidth – offsetWidth);
}

HTML
<div id=”iklan_kiri”>
<img src=”iklan-kiri.png”/>
</div><!–end of iklan_kiri –>
   
<div id=”wrapper”>
</div><!– end of wrapper –>

<div id=”iklan_kanan”>
<img src=”iklan-kanan.png”/>
</div><!–end of iklan_kanan –>

DEMO

Kunjungi www.proweb.co.id untuk menambah wawasan anda.

Latar belakang iklan di sisi kiri-kanan browser