IE6 içinde yaşanan iframe horizontal scrollbar problemi

Günümüzde ajax kullanımı ile birlikte iframe kullanımı azımsanmayacak şekilde azaltılmış olsada, bazı durumlarda iframe kullanmamız gerekiyor.

Iframe varsayılan olarak atamış olduğumuz yükseklik ve genişlik değerinden daha yüksek yada geniş bir içerik ile karşılaştığında scroll çıkartarak bize içeriği gezme imkanı sunar. Fakat IE6 burada bize yine bir oyun oynuyor ve içeriğin yüksekliği iframe için atamış olduğumuz yüksekliği aştığı anda iframe’in genişliği iframe için atamış olduğumuz içerikten daha düşük olduğu halde yatayda scroll çıkartıyor. Karışık bir tanımlama oldu ama umarım hatanın ne olduğunu anlatabilmişimdir.

Çözüm ise basit. Iframe içinde açılacak olan sayfamızın <head> tagları içinde aşağıdaki style tanımlamasını eklememiz sorunun çözülmesi için yeterli olacaktır.

<!--[if IE 6]>
<style type="text/css">
  html {overflow-x:hidden}
  body {overflow-y:hidden}
</style>
<![endif]-->

Yukarıdaki style tanımını incelerseniz başında ve sonunda <!–[if IE 6]>…<![endif]–> benzer bir tanım olduğunu görüceksiniz. Bu tanımlamayı kullanmamın nedeni eklemiş olduğum kuralın sadece IE6 için işletildiğine emin olmak ve bu hataya rastlanmayan diğer tarayıcıları etkilememesini sağlamaktır.