POSTINGAN TAMPIL DALAM BENTUK KOTAK

Bukan hanya sidebar saja yang bisa ditampilkan dalam bentuk kotak-kotak, postinganpun tidak mau ketinggalan, ingin tampil dam bentuk kotak juga. Untuk contoh cobalah anda buka link ini. Jelaskan, terlihat setiap artikel dari postingan ada didalam sebuah kotak.
Anda mau memiliki postingan dalam kotak seperti itu...? Simak langkah-langkahnya :

1. Sign ke Blogger.
2. Pilih Rancangan.
3. Pilih Edit HTML
4. Cari kode ini
   
   .post {
margin:.5em 0 1.5em;
border-bottom:1px dotted $bordercolor;
padding-bottom:1.5em;
}
5. Ganti kode diatas dengan kode dibawah ini.
   .post {
padding:10px; /* Jarak antara text post dengan garis pinggir */
Border-top: 3px solid #C3D9FF; /* warna garis pinggir atas */
Border-bottom: 3px solid #C3D9FF; /* warna garis pinggir bawah */
Border-left: 3px solid #C3D9FF; /* warna garis pinggir kiri */
Border-right: 3px solid #C3D9FF; /* warna garis pinggir kanan */
Margin-bottom: 15px; /* jarak antara post yang satu dengan yang lainnya */
}
   
   Kode #C3D9FF merupakan kode dari warna biru muda . Anda bisa mengganti kode warna tersebut dengan kode warna yang anda sukai.
6. Klik tombol Simpan Tempate ...lihat blog anda yang baru.

Jika ingin menamplkan border melengkung pada keempat sudut seperti pada contoh tadi buatlah seperti kode dibawah ini :

.post {
padding:10px; /* Jarak antara text post dengan garis pinggir */
Border-top: 3px solid #C3D9FF; /* warna garis pinggir atas */
Border-bottom: 3px solid #C3D9FF; /* warna garis pinggir bawah */
Border-left: 3px solid #C3D9FF; /* warna garis pinggir kiri */
Border-right: 3px solid #C3D9FF; /* warna garis pinggir kanan */
Margin-bottom: 15px; /* jarak antara post yang satu dengan yang lainnya */
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
}


Postingan ini telah berhasil dicoba pada blog pergobaan EPG Sudio

PENTING UNTUK ANDA BACA