Latar belakang iklan di kiri-kanan wrapper

Pernahkah Anda melihat web sejenis detik atau kompas dengan latar belakang iklan? Iklan terus berada di samping kiri-kanan wrapper bukan di samping kiri-kanan browser. Ingin tahu cara membuatnya?

1. Tentukan dahulu ukuran wrapper Anda.
2. Buat gambar iklan di kiri dan kanan, sedangkan bagian tengahnya sesuaikan dengan ukuran wrapper.

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

body{
background-color: white;
}

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

.bg_ads {
    width: 100%;
    top:0px;
    left:0px;
    z-index: -1;
    position:absolute;
}

.alt1 {
    background-image: url(blank_skin_ad.gif);
    height: 570px;
    background-repeat: no-repeat;
    background-position: center top;
}

HTML
<div class=”bg_ads alt1″ style=”background-image: url(iklan.png);”>
</div><!–end of adv –>

DEMO:

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

Latar belakang iklan di kiri-kanan wrapper