Buat 2 Kolum(lebar)

Kalau korang nak wat layout blog korang lebih kurang macam gambar kat bawah, inilah cara-caranya..



Mula-mula sekali korang kena ubah width semua layout.(header, outer wrapper, main wrapper, sidebar dan footer)




1) Seperti biasa cari kod header seperti di bawah


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


Ubahkan width kepada 950px(bold)


2) cari kod Outer-Wrapper seperti di bawah


#outer-wrapper {
width: 610px;
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}


Ubahkan width kepada 950px(bold)

3) Sekarang nak setelkan pulak kolum pos(main wrapper)

Macam biasa cari kod

#main-wrapper {
width: 410px;
float: $startSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

Ubahkan kepada 600(bold)


4) Seperti biasa cari kod sidebar seperti di bawah

#sidebar-wrapper {
width: 220px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}


Ubahkan width kepada 350px(bold)

5) Terakhir sekali Footer

Cari kod ini


#footer {
width:610px;
clear:both;
margin:0 auto;
padding-top:15px;
line-height: 1.6em;
text-transform:uppercase;
letter-spacing:.1em;
text-align: center;
}


Ubah width kepada 950(bold)

Ok siap.. save template korang.

Enjoy...

5 comments:

Post a Comment