BT ifade

IE8 Bu sayfasını görüntülerken, o zaman bu yazı arkasında tam bir opak beyaz arka plan görüyor olmalısınız. Ben değişiklikler yavaş yavaş ve sürekli adapte insanlardan biri olduğum Dün, benim meslektaşım bana (bu işaret ... özellikle tarayıcıları., Demek ben korkak, fakat işte .... bir UI geliştirici olmak olabilirdi, ben daima bok yeni tarayıcı sürümleri korkuyorum ... Senin hakkında tlaking olduğumu biliyor, değil mi?)

Peki sonra ne yapacağız bunu düzeltmek için bir çözüm bulmak ve çalışırken, süre yaklaşık kazılırken ...
Bu sefer bizim TÜM ZAMAN FAVORİ tarayıcı CSS opaklık için tüm destek bırakarak bunu tekrar yaptı. Standart dışı `filter: alpha (opacity = # #)` CSS özniteliği Nice, kaldırıldı, ama onlar da tamamen CSS3 donukluk desteği (tüm diğer tarayıcı güzelce onu tutmuş oluyor ne gibi) eklemeyi unuttuğu edilmiştir. ALLAH CSS opaklık (IE 5.0 yana, sanırım) anlattı beri Yani, ilk kez, bir web tarayıcı CSS opaklık desteklemez.
Ve şimdi üstüne krema için: IE 8 takımdan Resmi kelime? Bu "biz IE gelecek sürümünde bunu dikkate alacaktır" "tasarım", ve.

PS: FF bu sayfayı deniyorum, temiz görünüyor yemin ederim!

Hiç liste öğeleri (li) etiketleri ve CSS kullanarak (ya da bir yapım) Dikey Menü yaptıysanız, karşılaşabileceğiniz bu henüz IE blok düzeyi öğeleri içeren liste öğeleri arasındaki 6 ekler bu boşlukları, Internet Explorer, başka bir hata biçimlendirme liste öğeleri arasında herhangi bir boşluk varsa yani. Teşekkürler, ama hayır, teşekkürler, IE sürüm 7 Bu hata arınmış görünüyor.
Bana, ve daha birçok gibi, hala çok IE6 çalışarak yeni düzen, almak zorunda sinirli geliştiriciler, bu bant aitse, o zaman bu yararlı olabilir. Bir göz atın ...

Örnek biçimlendirme:

<ul id="menu">
<li> <a href="#"> Ana Sayfa </ a> </ li>
<li> <a href="#"> Hakkında </ a> </ li>
<li> <a href="#"> Hizmetler </ a> </ li>
<li> <a href="#"> Portföy </ a> </ li>
<li> <a href="#"> Yardım </ a> </ li>
<li> <a href="#"> Bize Ulaşın </ a> </ li>
</ Ul>

Bir dikey menü içine yukarıdaki biçimlendirme transfrom için, aşağıda bir benzer bazı CSS oluşturabilir ....

Örnek CSS ...
# Menu {
margin: 0; padding: 0; background: # FF9900;
list-style-type: none; width: 150px;
}
# Menu li {margin: 0; padding: 0;}
# Menu a {display: block;
color: # 555555;
text-decoration: none;
padding: 0 15px;
line-height: 2.5; border-bottom: 1px solid # FFF;
}

Göreceksiniz sonuçları ...

Bu hata ... (değiştirilmiş / koyu italik olarak CSS eklendi) için çözüm

# Menu {
margin: 0; padding: 0; background: # FF9900; list-style-type: none; width: 150px;
float: left; / * Bu yüzen liste öğelerini içerir * /
}
# Menu li {
margin: 0; padding: 0;
float: left; / * Bu düzeltmeleri * /
width: 100%; IE6 / * boşluk hata * /
}
# Menüsünden bir {
display: block; color: # 555555;
text-decoration: none;
padding: 0 15px;
line-height: 2.5; border-bottom: 1px solid # FFF;
}

Yukarıdaki çözüm etmediğinden (sadece IE6 bilinen nedenlerle) çalışmıyor gibi görünüyor ... Eğer bunun yerine bu yöntemi deneyin

Sadece biçimlendirme için bu ek IE6 sadece stilleri eklemek ...

<! - [If lt IE 7>
<style type="text/css">
# Menu li a {display: inline-block;}
# Menu li a {display: block;}
</ Style>
<[Endif] ->

Çeşitli vesilelerle anda, açılan bölümler / lightbox'lar / İpuçları sayfa düzenleri yaparken bazı Formu SEÇİN nesneler tasarım, bu POPUP Bölümleri altında olmak olur ve bunu üzerinden gösterir durumlara rastlamak vb .... YUK!

Eh! kolayca FF ve IE7 için uygun şekilde Z-INDEX değerlerini ayarlayarak bu FIX olabilir. Ama Good Old (cinas amaçlanan) IE6 amaçlandığı gibi davranırlar değildir .... Size PopUp Bölümü ... Kötü haber!! Bazı önemli ölçüde yüksek Z-INDEX değerleri uygulandıktan sonra bile üzerinden Select BOX gösterisi!

Bu sorun için NO HOTFİXLERİN vardır, ama vardır, inanıyorum ki, sen çoğunda benim için çalışıyor kullandığım basit çözüm, anlatmak için ben burada birkaç Bu soruna-yol, ama daha durumlarda ....

"SİZ POPUP GÖSTER ZAMAN ROUGE SEÇİN KUTUSU HIDE"

Basitçe komut pasajı içinde size açılır gösterin, "Gizli" için SELECT Kutusu görünürlüğünü ayarlamak için komut bir parça eklemek

document.getElementById ('my_select') style.visibilty = "gizli".;

Ve PopUp Bölümü KAPAT üzerine geriye unutmayın

. document.getElementById ('my_select') style.visibilty = "görünür";

burada "my_select" tahriş Select Box kimliğidir

Bu yardımcı olur umarım ...

PS. Dinamik Popup DIV altında bir IFRAME (siz PopUp olarak aynı boyutta) positionining gibi tabii diğer seçenek vardır ... Bu çok iyi çalışır, ancak DOM Elemanları, SCRIPTLER ve Baş Ağrısı yükleri bir ilavesi ile. Ben de bu çözüm kullanmış ve yaparsanız bu seçeneği ile yardım herhangi bir ihtiyacınız, bana bildirin. Yardımcı olmaktan memnun olacaktır!

Birkaç ay önce biz (sadece IE6 için görünür olacaktır CSS bir parça içerebilir nasıl gördü Yalnızca partilerin kadınlar için ). De bunu başarmak için başka yolları da vardır. Basitçe, ayrı bir CSS dahil hedef IE özgü. Bu Koşullu Yorumlar denir ne ile elde edilebilir.

Şartlı Yorumlar tarayıcı türü ve sürüm algılamak için bir yoldur. Tarayıcı algılama içeriği belirli bir tarayıcı sunulan sağlamak için gerçekleştirilir. Tarayıcı algılama çok farklı teknikler kullanılarak yapılabilir. Bu yöntem, javascript kullanarak stili geçiş dahil daha önceki yöntemlere göre bazı avantajları vardır. Önemli birkaç listelemek için, olurdu;

• Scripting gerekli değildir
• Çapraz tarayıcı

Bunu nasıl yapacağız?

IE 5 şey yapın sadece
<!--[if IE 5]> Welcome to Internet Explorer 5. <![endif]-->

Tüm IE sürümleri bir şey yapın
<!--[if IE]>
<link href="css/ie.css" rel="Stylesheet" type="text/css" />
<![endif]-->

Yeni tüm IE sürümlerinde bir şey yapın ki IE 5
<!--[if gte IE 5]>
<script type="text/javascript"><!--
alert("Congratulations! You are running Internet Explorer 5 or greater.");<br />
// --></script>
<![endif]-->

Daha koşullu vartiations için MSDN'de bu bilgiyi okuyunuz:
Koşullu Yorum Hakkında

Basit şeyler sadece IE6 çalışmaz reddediyor nasıl, bazen fark ettiniz ... location.href böyle bir şeydir.

Aşağıdaki gibi çapa etiketi için bir onclick işlevi eklediyseniz ...

<a href="javascript:void(0);" onclick="onClickLink('xxx');"> Yeni bir konuma gitmek </ a>

Bu gibi bazı fonksiyon ile ...
fonksiyonu onclickLink (id) {
var URI = "test2.html id =?" + id;
window.location.href = URI;
}

Senin ironi için, basit bir script böyle bir parça IE çalışmak reddediyor çarpacaktır ... Eh! Burada nedenleri tartışmak, ama değerli olacak ... olsa da, ben bir çözüm var gibi yok ... düşünemiyorum (bu IE6 için çimdik kattığını görebilmek için Javascript anlamak Eminim, sen, anlayacaksınız)

Çözüm

<a href="javascript:void(0);" onclick="onClickLink('xxx'); dönüş false; "> yeni bir konuma gidin </ a>

Eğer herhangi bir basit yanıtlar ise, bir yorum yazmak yapın. Gerçekten çoğu tarafından, Eminim, appretiated olacak!

Eğer süre için CSS yazmaya kaldıysanız, CSS düzenler, tüm yeni tarayıcıları (Daha sonra IE6 daha tarayıcılar ortalama) ince baktığımda kelimenin tam anlamıyla saç çektiğinizde o zamanlar tecrübe olurdu, ama IE 6 tantrum atar. Eğer CSS ayarlamak zor mücadele ama çalışmıyor ... Eh! Bu Siteye Geri deneyin ...

1. Kesmek çizgi: -
Tanım olarak, CSS 2.1 spesifikasyonu CSS tanımlayıcıları ("_") çizgi verir. Ama birçok tarayıcı hala herhangi bir ile devam tanımlayan underscore görmezden ama IE gibi görünüyor. Bu IE hata / özellik böylelikle sadece Mühendisleri İçin CSS özellikleri ayarlamak için çok net bir şekilde olur. böylece Internet Explorer (tüm sürümler ama IE 7) olarak görebilir, start çizgi ile yazılmış bir CSS özelliği hatırlıyorum

#box {
min-height: 300px;
height: auto;
_height: 300px; /* all IE versions less than version 7 */
...
}

Bu bakış gösteri hack çizgi

Ayrıca, IE6 min-height hilesi altını kesmek kullanır, check out

2. Hash (#) Hack: -
Hack çizgi gibi, bu iyi bir fark, çok IEs Oly için ise, start # ile mülkiyetinden önce tanımlayıcıları Tüm IE sürümleri için görünür, IE7 dahil ve diğer standart tarayıcı için görünmez.

.obj_container {
display: table-cell;
vertical-align: middle;
#position: absolute; /* For IE only */
#top: 50%; /* For IE only */
#left:50%; /* For IE only */
}

Bu kesmek dikey çözüm hizalamak bir çapraz tarayıcı göstermek için güzel kullanılmış, bizim daha bulmak için bu makalenin bir göz

3. IE6 CSS sadece: -
#my_bad_behaving_div {
/*something for all browsers*/
}
/* Lets use the * html hack so only IE6 reads the rule */
* html #my_bad_behaving_div{
/*something for IE6 only*/
}

Bu kesmek başka bir şey çalışır zaman cennete gönderdi görünüyor ... bu hack herhangi bir gün hayatınızı kurtarır, bir kahve :) beni tedavi etmek için unutma

Sana bir bölümü (DIV) ve bu bölümü bir mouseover olay olsaydı, bazı iyi bir nedenle (bunun mouseover üzerinde bir resmin üzerine bazı etiketler görüntülemek için gerekli oldu benim durumda, gibi şeffaf olması gerekiyordu, bu sorun vardı Bu şeffaf bölme), IE mouseover olay (FireFox ince çalıştı) tetiklemek için başarısız oldu.

Yargılanan birkaç seçenek ... birçoğu sadece IE yangın olayı almak için umutsuz bir girişim oldu. Çalıştığım düşündüm mantıklı olanları, biri lige bir arka plan rengini ayarlamak ve sıfır opacity oldu ... Eh! iş kuvvetiyle!

Çalışmak ve gerekli işlevselliği rahatsız görünüyordu nihai çözüm bu bölümü tekrar / şeffaf arka plan resmi bir piksel koymak oldu

Silly ...! ama şimdi IE mutlu görünüyor.

Basit ... Bu sorunu kullanımını ekran düzeltmek için: inline.

div {float:left;margin:40px;display:inline;}

Böyle bir div olarak yüzen elemanın var ve margin-right veya öğe üzerinde margin-left koyarsanız, Internet Explorer 6.0 html / css düzeni darmadağın, bu sınır değeri iki katına çıkacak. Bunu düzeltmek için sadece ekran ekleyin: inline; sizin kayan eleman.