Pastinya udah pada tau ya apa itu sidebar, jadi ga perlu diterangkan lagi. Sekarang kita akan membuat sidebar dalam kotak yang terpisah. Artinya adalah menambahkan pembatas di sekeliling sidebar agar terpisah dari area di sekitarnya seperti area posting.
Oke langsung saja ke cara pembuatannya.
border-bottom:1px dotted $bordercolor;
margin:0 0 1.5em;
padding:0 0 1.5em;
}
background:#fff url(http://i38.tinypic.com/2lt5wsl.jpg) repeat-x top;
border:1px solid #0B610B;
margin:0 0 0.5em;
padding:0.5em;
font-family:"Trebuchet MS";
}
Oke, mudah-mudahan tidak ada kesulitan yang ditemui. Seperti yang saya katakan di atas, semua kode tersebut masih dapat anda utak-atik. Selamat mencoba dan semoga berhasil.
contoh-contoh sidebar dalam kotak komentar salah satunya seperti gambar dibawah ini:
Sidebar tanpa border pembatas
Sidebar dengan border pembatas dan header background
BACA JUGA!
- Membuat related post dengan scroll
- Cara memasang google Translate bendera
- Menampilkan kode html dengan kotak background
- Mengganti Tulisan Posting Lama dan Posting Baru dengan gambar
- Cara Menghilangkan Tulisan Subscribe To Post (Atom) Blog
- Cara membuat related post bergambar
- Cara membuat tag cloud
- Membuat header menjadi dua kolom
- Membuat buku tamu/shoutmix tersembunyi
- Tabel kode warna css
- Cara mudah Memasang shoutmix bersama
- Cara memasang widget alexa pada blog
- Cara meningkatkan alexa rank blog
- membuat kotak daftar isi blog
- Cara Mengukur seberapa berat blog/web kamu
- Cara supaya domain co.cc bisa diakses tanpa www(redirect tanpa www)
- Merubah Domain Blogspot menjadi co.cc
- Membuat scroll pada komentar blog
Membuat sidebar dalam kotak yang terpisah
.sidebar .widget, .main .widget {
.sidebar .widget {
Labels:
tips blog
Subscribe to:
Post Comments (Atom)
0 comments:
Post a Comment