Cara Lebar Kolom pada Blog

gis. Rabu, April 14, 2009

Gimana seeh caranya merubah lebar kolom pada blog,..?? itulah pertanyaan gwe sebagai newbie ketika pertama kali punya blog di blogspot milik mbah google, sekarang juga masih tetep newbie : ) : ) : ). Ato buat kawan yang belum punya blog bisa daftar disini.
sedikit berbagi pengetahuan soal merubah lebar kolom pada blog tetapi merasa kurang sreg sama lebar kolom yang ada tidak sesuai keinginan kita, baik itu lebar kolom sidebar (yang adanya disamping) atau mainbar (buat tempat posting). lumayan nih ada tips buat mengakalinya supaya lebar kolom menjadi sesuai dengan keinginan kita sendiri.

Contoh letak kode-kode untuk mengatur lebar kolom:


#header-wrapper {
width:900px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}

#outer-wrapper {
width:900px;
margin:0 auto;
padding:10px;
text-align:justify;
font: $bodyfont;
}
#main-wrapper {
width: 435px;
margin-left: 20px;
margin-right: 20px;
float: left;

}
#sidebar-wrapper {
width: 220px;
float: right;
}

Dah liat khan kode-kode diatas, yang diwarnain merah artinya ukuran lebar suatu kolom. Width (lebar) klo 900px adalah ukuran lebarnya yaitu sebesar 900 pixel.

Agar lebih faham, kode-kode diatas saya uraikan :

header-wrapper : biasanya sebagai kolom judul blog / kepala pada blog.
outer wrapper : adalah lebar keseluruhan yang di sediakan untuk kolom-kolom yang ada, didalamnya ada kolom main-wrapper, dan sidebar-wrapper.
main-wrapper : adalah kolom halaman posting, apa-apa yang kita posting maka akan masuk ke halaman ini.
sidebar-wrapper :adalah kolom sidebar atau kolom tempat di mana kita menyimpan berbagai aksesoris atau yg lainnya
width : ukuran lebar
xxxxpx : nilai lebar dalam pixel, contoh ( 900px berarti mempunyai lebar sebesar 900px)
border : adalah bingkai atau garis tepi (solid = garis penuh, dashed = garis putus-putus, dotted = garis berupa titik-titik)
$bordercolor; : Warna untuk border , contoh ( ffffff = putih, 000000 = hitam )