Internet Explore (IE) Bikin Blog ku Berantakan :(

Salah satu hal yang mungkin banyak terlupakan ketika kita membuat blog adalah menge-tes layout blog di berbagai browser. Hal ini penting dilakukan karena kita tidak pernah tau browser yang dipilih pengunjung untuk mengakses blog kita. elengahan terhadap hal tersebut baru saja menimpa diri saya-yg nota bene adalah pendatang baru di dunia blog yang ternyata menyimpan sejuta misteri.

Sejak awal saya asyik mengoprek blog menggunakan browser mozilla firefox 2.0. Setelah berhari-hari melotot di depan komputer sambil berselancar kesana-kemari mencari referensi, akhirnya layout bisa tampak rapi dan tidak terkesan sebagai blogger pemula. Berbagai elemen yang ada seperti header, main body dan sidebar tertata pas di posisinya masing-masing sesuai yang diangankan.

Hari berganti hari sampai waktu sudah berjalan dalam hitungan bulan yang berganti, saya masih belum ngeh untuk mencoba nge-cek blog di browser selain mozilla. Sampai pada suatu saat seorang teman bilang kalo blog ku (agak) berantakan. Aku masih bersikukuh bahwa layout blog ku ga ada masalah karena setelah ada feedback tersebut, saya cek blog (lagi-lagi di mozilla) layout nya masih rapi. Namun alangkah terkejutnya saya ketika secara tidak sengaja saya coba lihat blog di IE. Layout nya ternyata memnag berantakan. Sidebar sebelah kanan yg didominasi adsense, tiba2 saja nyelonong ke bawah sidebar sebelah kiri.

Spontan saja rasa bingung dan gusar segera menghinggap. Layout segera ku oprek. Hampir dua hari nyari cara belum ketemu juga. Di titik akhir dimana sudah hampir dihinggapi rasa putus asa, tiba2 ada ide untuk mengurangi lebar main body. Dan setelah diotak-atik akhirnya sidebar kanan mau naik ke posisi nya semula. Ternyata “hanya” sepele. Ah lega.....

Berikut ini beberapa langkah (setelah muter-muter ga karuan nyari referensi dari berbagai sumber) yang saya lakukan untuk mengatasi blog agar blog kompatibel dengan berbagai browser (khusunya mozilla dan IE) :

1.menyisipkan kode

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 */

di bawah kode

#content-wrapper
#main-wrapper
#sidebar-wrapper

sebelum kurung tutup “)”

2.menyesuaikan lebar “main”, "main-wrapper" dan "sidebar"
Dalam hal ini, lebar "main" dan "main-wrapper" harus sama.

Bagi temen-temen yang mengalami problem sejenis, semoga info ini bermanfaat. Segera cek tampilan blog Anda di berbagai browser yang sekiranya sering digunakan pengunjung,
Waspadalah..! Jangan sampai Blog Anda berantakan..!