Sorun tam olarak şu; açılır bir menü eğer bir resim üzerinde ise menü içindeki input alanı üzerine gelince menü istem dışı olarak kapanıyor. Diğer hiç bir tarayıcıda sorun yokken ie8 bu durumda sorun oluşturuyor.

İnternet Explorer’ın sorunlarına alışmış bu bünye Microsoft’un bu yeni nesil eskimiş tarayıcısından böyle bir sorun olmasını yadırgamadı açıkçası. Soruna ie7 gibi yorumlama kodunu ekleyerek çözmek istedim ama kod sitenin dinamik kısımlarında çalışırken statik kısımlarında çalışmadı.

Bu iş ile bir projede karşılaştım, proje ismini açıklamak sakıncalı olabilir diye ben size benzer bir örnek kodunu vereceğim. 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script type="text/javascript">
 $(document).ready(function() {
	$('a').hover(function(){
		$(this).children(':last').show();
	},
	function(){
		$(this).children(':last').hide();
	});
 });
</script>
<style type="text/css">
a{ position:relative;}
	a div{display:none; padding:20px; background-color:#999; width:250px; position:absolute; top:18px; left:0}
		a div input{ background:transparent}
</style>
</head>

<body>
<a href="javascript:;">menu aç
<div><input type="text" /></div>
</a>
<p><img src="http://fatihhayrioglu.com/images/ie7_kaydirma_cubugu.jpg" width="450" height="398" /></p>
</body>
</html>

Örneği görmek için tıklayınız.

Bende sorunu araştırmaya başladım ve sonunda buldum. Sorun input‘a atanan background:none veya background:transparent tanımlamalarından kaynaklanıyor. backgorund’a renk veya resim tanımı yapınca sorun çözülüyor.  

Ben tasarıma uymak için background’a resim tanımlayarak sorunu aştım.

Kaynak

Google Chrome DevTools İpuçları 2

[İlk yazıyı](http://fatihhayrioglu.com/google-chrome-devtools-ipuclari/) yazdıktan sonra hangi özellikleri kullandığıma daha çok dikkat e...… Devamını oku

font-display özelliği

24 April 2018 tarihinde yayınlandı.

CSS4 sistem fontu (system-ui) değeri

03 April 2018 tarihinde yayınlandı.