CSS Reset Blogger Tabs

Blogger memang telah menyedialan sebuah fitur yang memungkinkan penggunanya untuk membuat sebuah tabs horizontal dan vertical. Tab hoizontal akan terpasang di bawah header blog atau di atas post title. Sayangnya kode yang digunakan untuk tabs blogger (navigasi menu) menciptakan sedikit problema baru bagi penggunanya. Banyak masalah bermunculan saat pengguna mencoba untuk membuat menu horizontal baru dengan kode yang dibuat sendiri akibat kurang puas dengan tampilan tabs horizontal default blogger. Disamping banyak variable yang tak diharapkan muncul di tabs/menu yang kita buat, seperti background dan border, namun jika kita sedikit lebih cermat maka akan merasakan betapa sebuah horizontal drop menu atau horizontal dropdown menu tak dapat dibuat karena anak menu atau anak-anak menu yang seharusnya meluncur ke bawah tiba-tiba terlihat terpotong tanpa sanggup melewati post title. Sungguh situasi yang sangat tidak mengenakkan dan sering membuat pengguna putus asa. Bahkan..., banyak blogger yang akhirnya memilih menggunakan template hasil download atau template lama blogger hanya sekedar agar bisa menggunakan horizontal dropdown menu. Sebuah kebijakan yang menurut saya sangat salah karena menggunakan kode yang bersifat sangat "eksklusif" sehingga menyulitkan pengguna untuk membangun blog dan melengkapi blog dengan berbagai fasilitas baru untuk mempermudah pembaca mengakses seluruh bagian blog.

CSS Reset untuk tabs blogger dimaksudkan untuk menetralisir permasalahan yang muncul ketika blogger hendak membuat sebuah menu horizontal dengan kode baru yang dibuat sendiri. Kode css ini bisa disimpan di bawah kode css tabs default blogger atau bisa juga disimpan di atas kode ]]></b:skin>. Jika kemudian anda bermaksud membuat menu dengan kode css hasil buatan sendiri atau hasil copy dari berbagai tutorial blogger yang banyak ditemukan, silahkan kode css menu baru disimpan di bawah kode css reset.

Kode css Reset

/* css reset blogger tabs  */
.tabs .widget ul,.tabs .widget li,.tabs .widget li a{
      margin:0;
      padding:0;
      }
.tabs .section:first-child,.tabs .section:first-child ul,.tabs .widget ul,.tabs .widget li,.tabs .widget li.selectrd,.tabs .widget li.selected a,.tabs .widget li a,.tabs .widget li:first-child a{
      border-radius:0;
      background:none;
      border:none;
      }
.tabs .widget li a:hover{
      background:none;
      }
.tabs .widget ul{
      list-style:none;
      overflow:visible;
      min-height:32px;
      } /* min-height untuk memunculkan background ul */
/* css reset blogger tabs  */