Andri Yadi

A geeky technopreneur, trying to do something big with his startup

Internet Explorer 8 Beta 2 Hates asp:Menu Control

Saat ini saya sedang membangun sebuah aplikasi web yang harus compatible dengan sebanyak mungkin browser yang ada di dunia, tidak terkecuali pendatang baru, Google Chrome dan versi terbaru dari Internet Explorer 8 Beta 2. Aplikasi tsb dibangun dari scratch, dimulai dari MasterPage. Ketika MasterPage di-apply pada page pertama, page tsb dapat ditampilkan dengan baik dan persis sama pada semua browser yang terinstall di laptop. Kebahagiaan itu segera berakhir ketika mencantumkan control asp:Menu untuk keperluan pemenuan.

Ternyata IE 8 Beta 2 tidak bisa menampilkan sub menu dari asp:Menu, they're displayed just blank. Beginilah tampilan control asp:Menu pada beberapa browser.

IE 8 Beta 2

image
Seperti itulah tampilan asp:Menu pada IE 8 Beta 2. Ketika sebuah menu (yang memiliki sub menu) di-hover (mouse over), hanya border dari sub menu yang ditampilkan, isinya kosong dan transparent.

IE 7 Compatibility

Fortunately, di IE 8 ada button image di dekat address bar, untuk menampilkan web page dalam tampilan Compability View yang compatible dengan IE 7. Jika button tersebut diklik, contol asp:Menu - yang ditulis dengan code (declarative code dan CSS styles) yang sama - bisa di-render menjadi seperti berikut, which is the right thing.

image 

Sekarang mari kita lihat hasil render pada beberapa browser lain.

Google Chrome

image

Mozilla Firefox 3

image

Opera 9

image

Semuanya persis sama. So pertanyaannya, what's wrong with IE 8?

Sebagai informasi, saya menggunakan asp:Menu bersama dengan ASP.NET 2.0 CSS Friendly Control Adapters 1.0, yang bisa me-render menu dengan tampilan lebih baik, lebih friendly terhadap CSS, dan much configurable dengan CSS. Saya kira penggunaan adapter tsb yang membuat masalah dengan IE 8. Tapi setelah digunakan pure asp:Menu, hasilnya tetap sama.

Setelah google-ing, live-ing, dll, ternyata beberapa orang mengalami hal yang sama. Belum ada workarounds yang resmi dari Microsoft, seperti yang bisa dilihat di https://connect.microsoft.com/IE/feedback/ViewFeedback.aspx?FeedbackID=364930. Di forum asp.net, ada yang berpendapat bahwa mungkin karena IE 8 masih beta.

As far as I know, sementara ini yang dapat dilakukan adalah "memaksa" IE 8 untuk mem-render page yang compatible dengan IE 7. Caranya adalah dengan menggunakan tag berikut paga bagian <head>:

<head>
  <!-- Use IE7 mode -->
  <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
  <title>My Web Page</title>
</head>

If anyone can tell the better way, without having to emulate IE 7, please let me and others know. Looks like IE 8 needs more attention before release it to RTM.

That's it, enjoy.

Share this post: | | | |
Published Sep 07 2008, 06:37 PM by andriyadi
Filed under:

Comments

No Comments