Tutorial: Body Melengkung

| On
2:18:00 AM

Annyeong n Selamat Hari Raya chingu!

amacam raya? best tak?  Amni besa-besa je, sbb sibuk dgn wedding pakcik Amni sekali.. hehhe

oklah, jom kita teruskan tutorial kita pada malam buta nie..
sebenarnya tuto nie d'request oleh k.Izzatie Affiqah

sebelum tu, korang tau ke apa itu "Body Melengkung" 
kalau tak tau, meh sini nak tunjuk..


*ha! yg lengkung-2 tu la..

Tutorial body melengkung ni  Amni godek code snirik tau! but, ada jgk Amni buad penambahan supaya lebih kemas...

ok, cara dye senang aja..

1. Log in > Dashboard > Design > Edit HTML

2. Tekan Ctrl + F and korang search..
/* Outer-Wrapper

3. Then, korang akan jumpa code yg macam nie..
/* Outer-Wrapper
----------------------------------------------- */
#outer-wrapper {
  width: 660px;
  margin:0 auto;
  padding:10px;
  text-align:left;
  font: $bodyfont;
  }
#main-wrapper {
  width: 410px;
  float: left;
  padding: 5px;
  border:1px solid $bordercolor;
  background-color:#ffffff;

  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 */
  }
#sidebar-wrapper {
  width: 220px;
  float: right;
  padding: 5px;
  border:1px solid $bordercolor;
  background-color:#ffffff;

  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 */
}
4. Korang delete la code yg Amni tunjuk tu, and.. paste code yg baru ni..
/* Content
----------------------------------------------- */
.clear {
clear: both;
}
#content-wrapper {
-moz-border-radius-topleft: 20px;
-moz-border-radius-bottomright: 20px;
-moz-border-radius-topright: 20px;
-moz-border-radius-bottomleft: 20px;
-webkit-border-top-left-radius: 20px;
-webkit-border-top-right-radius: 20px;
-webkit-border-bottom-left-radius: 20px;
-webkit-border-bottom-right-radius: 20px;
-top-right-radius: 20px;
border-top-left-radius: 20px;
border-top-right-radius: 20px;
border-bottom-left-radius: 20px;
border-bottom-right-radius: 20px;
border: 1px solid #FAAFBA;
width: 760px;
margin: 0 auto;
padding: 0 0 15px;
text-align:$startSide;
background-color: #FFFFFF;
margin-top: 0em;
font: $bodyfont;
  -moz-border-radius: 35px;
border-radius: 35px;
Padding:25px; /* Jarak text post dengan garis pinggir */
}
#main-wrapper {
border: 0px solid #FAAFBA;
  width: 423px;
  float: left;
-moz-border-radius: 35px;border-radius: 35px;Padding:25px; /* Jarak text post dengan garis pinggir */
  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 */

}
#sidebar-wrapper {
border: 0px solid #FAAFBA;
font family: calibri;
  width: 233px;
  float: right;
  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 */
-moz-border-radius: 25px;
border-radius: 25px;
Padding:25px; /* Jarak text post dengan garis pinggir */
}

5. Korang tambah la apa yg korang nk tambah.. sbb nie code body blog Amni, so, kepad siapa yg pndai bab godek-2 code nie, buad la.. hehhe kpd yg tak pndai, x pyh la.. nnti jd apa apa, Amni tak nak tanggung! 


6. Save, Dah siap!




Related Post:

  • Tutorial: Underline Background dan selamat malam.. dah lamekan Amni tak buat tuto? hehe. Amni bkn nye malas nk buat tp, Internet kat rumah nie slow gila. kalah siput babi. hish! sakit jiwa dibuatnya.. … Read More
  • Tutorial: Facebook LIKE Button ok, sekarang Amni nak ajar korang mcm mana nak letak FB Like button d'setiap entry kat blog korang..cer korang tgk kat bwh post-post Amni, ada kan FB Like button? ha! kalu korang … Read More
  • Tutorial: Tukar Sidebar Title kepada Image  Haii..hai korang!! sehat tak? Amni ok je..Tutorial nie Amni buat utk sesiapa yg ada Sidebar Title Image.. mungkin ramai yg dah tau, tp Amni still nak ajar sbb ada newbie yg … Read More
2 comments on "Tutorial: Body Melengkung"