Membuat Sidebar Dalam Kotak-Kotak yang Terpisah

Membuat Sidebar Dalam Kotak-Kotak yang Terpisah

sudarma

Satu lagi ni tutorial blog yang saya demen sobat ( semua tutorial saya seneng kok). Dengan menerapkan tutorial ini blog saya kelihatan lebih rapi sidebarnya. Selain diterapkan dalam sidebar, teknik ini juga bisa di terapkan di postingan/main bar( bener gak ya). Tutorial ini saya dapatkan setelah lama melakukan pencarian, baik dengan bertapa maupun dengan berpuasa ( becanda, mencarinya dengan ngetik di google kok). Tutorial ini ketemu di tempat kang rohman. Oke biar ga terlalu lama ngebacot saya lanjutkan ke gerakan berikutnnya, kaki di naikkan ke atas, tangan di lipat ke belakang, wek kok jadi senam???

Ini ni langkah yang sebenarnya :) biar blog bisa kayak blog sederhana ini. Oke pertama buka html ( tau caranya kan?) oke biar seragam saya contohkan kode yang ada di blog ini :
ini ni kode yang saya rubah biar dia ( sidebarnya) mau berpisah, dan berwarna.

#sidebar-wrapper .widget, .main .widget { margin:0 0 1.5em; padding:0 0 1.5em; }

nah biar lebih gampang ngerubahnya kita bagi dua kode tersebut ( kode diatas itu berarti sidebar widget dan main widget akan didefiniskan selalu sama), setelah di rubah ke dua kode tersebut menjadi seperti di bawah

#sidebar-wrapper .widget{ margin:0 0 1.5em; padding:0 0 1.5em; }

#main .widget { margin:0 0 1.5em; padding:0 0 1.5em; }

nah untuk sidebarnya kita utak-atik kode yang ini

#sidebar-wrapper .widget{ margin:0 0 1.5em; padding:0 0 1.5em; }

untuk memberika kesan terpisah sobat bisa memberikan variasi seperti ini

#sidebar-wrapper .widget{ background:#fff; border:1px dotted #6c6b6b; margin:0 0 1.5em; padding:0.5em; }

kode yang merah bisa sobat ganti sesua dengan kreatifitas masing2..Semoga penjelasan saya tidak susah dimengerti :) Selamat mencoba :)