Friday, July 30, 2010

Cara Membuat Dua Kolom Di Bawah Header

Banyak cara dapat dilakukan untuk mempercantik blog, bisa dengan menambah ini menambah itu dan masih banyak yang lainnya.
Untuk itu kali ini saya coba memberi tutorial untuk menambah dua kolom di bawah header, nanti kamu bisa menambah script html di kolom tersebut .


dua kolom di bawah header


kolom di bawah header


Mudah kok . . Membut dua kolom di bawah header


Begini :


Masuk ke blogger kamu.


Masuk ke bagian Layout -> Edit Html


Beri tanda centang expand template widget



Kemudian cari kode ]]></b:skin>


Silahkan taruh kode di bawah ini di atas ]]></b:skin>

#box-main-container {
clear:both;
}
.box-column {
padding:0px 10px 10px 10px;
border:1px dotted $bordercolor;
}



Kemudian copy kode di bawah ini dan pastekan di atas <div id='main-wrapper'>


<div id='box-main-container'>
<div id='box1' style='width: 50%; float: left; margin:0; text-align: left;'>
<b:section class='box-column' id='col1' preferred='yes' style='float:left;'/>
</div>
<div id='box2' style='width: 50%; float: right; margin:0; text-align: left;'>
<b:section class='box-column' id='col2' preferred='yes' style='float:right;'/>
</div>
<div style='clear:both;'/>
</div>


Simpan . .

Silahkan masuk ke Eleman Halaman untuk melihat hasilnya.