Pengikut

11 April 2006

CSS : word-wrap for IE

Sepastinyalah bila kata-kata word wrap terasa akrab di lingkungan aplikasi text berbasis Windows.Sebut saja Notepad, WordPad (saat kita ingin membungkus text seukuran jendela aplikasi),Word (misalnya saat kita ingin menyeting word-wrap untuk kata-kata berbahasa Inggris disaat bekerja di lingkungan text menggunakan East Asia), dan banyak lagi.

CSS di IE pun tak luput dari kata-kata ini.Lalu apa gunanya?

Masih ingat postingan yang lalu tentang bangunan template Blogger yang terdiri dari Main, Content,Sidebar? Ok, ini masih berhubungan dengan hal itu.

Anggap kita memiliki lebar Content 740 px, Main 485 px, lalu Sidebar 240 px.Terkadang tanpa kita sadari saat memasukkan tautan/link ke dalam postingan kita menuliskanya secara utuh, semisal http://www.domainku.com/admin/intern/download/gratis/aplikasi/blablabla.htm, maka dari 76 karakter tersebut kemungkinan akan menyeruak keluar menabrak bagian Sidebar.Hasilnya? saat kita buka di browser IE, sidebar turun jauh kebawah.Nah untuk itulah properti word-wrap diperlukan, cukup bubuhkan tag berikut :

word-wrap:break-word;

di bagian .post-body, sehingga akan tampil seperti ini (untuk contoh):

.post-body {
line-height: 140%;
word-wrap:break-word;
}


Maka IE akan memberlakukan word-wrap dalam bagian Main.Ingat, hanya IE.Browser diluar IE akan mengacuhkan bagian word-wrap:break-word.Hasilnya? tentu bila kita cek di IE alamat URL yang panjang tadi akan terpotong kebawah tanpa mengenai bagian Sidebar.