Monday, October 15, 2012

Tutorial: Centerkan Header

Aloha! Malam nie Eyz nak bagi tutorial kat korang, macam mana nak centerkan header korang. Mungkin ramai yang dah tahu tapi saja jer Eyz nak rajin-rajinkan diri nak buat jugak. Sajer. Hihihihi.


:: Langkah Pertama ::

1. Dashboard >> Design >> Edit HTML

2. Expand kan HTML tu. Tickkan jer kat 'Expand' tu

3. Tekan Ctrl + F, cari kod:

/* Content

4. Copy kod yang ada kat bawah nie, paste kat atas kod yang korang copy tadi.

       .Header img {
      margin-$startSide: auto;
      margin-$endSide: auto;
    }

**Akan jadi macam nie!

     .Header img {
      margin-$startSide: auto;
      margin-$endSide: auto;
    }
/* Content

 5. Preview dulu. Lepas tu baru boleh SAVE! ^_^



:: Langkah Kedua ::
 * Kalau tak dapat buat yg kat atas nie. Cuba langkah kedua nie plak. Jangan risau. Pasti ada jalan penyelesaiannya tu.


1. Dashboard >> Design >> Edit HTML

2. Expand kan HTML tu. Tickkan jer kat 'Expand' tu

3. Tekan Ctrl + F, cari kod:

 #outer-wrapper {

 *Bawah kot yang dicari tadi ada kod nie: cth jer nie.

     background:#FFFFFF;
    width: 1000px;

 * 'width: 1000px' tu maksudnya korang punya outer wrapper.

4. Lepas tu, korang cari lagi kod nie:

 #header-wrapper {

5. Dah jumpa? Pastikan width header-wrapper nie sama dengan width outer wrapper tadi tu. Kalau dah sama tu maknanya header korang center dahla tu,

6. Cuba Preview dulu. Konfem jadi baru SAVE yer! 



INGAT!!! Tekan Ctrl+C serentak untuk COPY CODE dalam tutorial.

No comments: