IT kifejezése

Idő és újra, amikor minden más böngészőkben tekinthető viselkedni, mint mondta, a W3C szabályok, azaz spirál téged a fejlesztési szellemét dobtak egy hisztit, hogy úgy tűnik, nem egy fix. Csak egy ilyen ember van ebben a kérdésben az IE7.

Probléma nyilatkozat:
Én így is sok más súlyos web-fejlesztők, hogy észrevette több mint sok idő, hogy amikor egymásba ágyazott úszik az elrendezés, a fölé viszi néhány link (anchor tag), az azt tartalmazó tartályt úgy tűnik, hogy váltani néhány pixel a jobb . Megpróbáltam a Google megoldások ebben a kérdésben, de alig talált ésszerű válasz, hogy miért és mikor fordul elő (amely segíthet megakadályozni ezt a kérdést történik), így még soha nem találtam egyértelmű megoldást a problémára sem ...

Lehetséges megoldás:
Elfogyott a tapasztalat, én is megfigyeltem 90% százaléka az idők, azaz, hogy ez a kérdés hozzáadásával határozzák meg a zoom tulajdonság a CSS meghatározása rosszul viselkedő konténert ...

 {# Somediv
       zoom: 1;
 }

Ismét az okok egyértelműek ... próbáld ki ezt ...
Egyes elemek IE-ben van egy "hasLayout" tulajdonság, ami "igazi" alapértelmezés szerint. Sok vizuális CSS viselkedést, például egy alfa szűrőt csak akkor működik, egy olyan elem, hasLayout. és a {Nagyítás: 1} Úgy tűnik, hogy a cél az elemek hasLayout tulajdonság .... Hasznos? Nem hiszem, szóval ...

A zoom tulajdonság is látszik, hogy támogatja a Chrome, de használatát látta úgy tűnik, hogy sok káros hatás az én elrendezés ... próbáld ki, Ha működik neked ... ha nem, könyvjelzőt ezt az oldalt a "CSS kockavetés"

A Google elindítja a mozgást gyors emberek kiírási IE6 ... A lehallgatás IE6 felhasználók egy popup oldalon terhelés ... lehet, nem túl jó ötlet ... de hogy egy UI fejlesztő, van, hogy csatlakozzanak ehhez Band Wagon ... eggyel kevesebb böngésző aggódjon Bocs ... ez önző! de én ezt a javascript ... (TRY ez az oldal IE6) ...
Hé! és a fényesebb jegyzet ... Nézze meg a kijelzőn a POWER JavaScript .... ez is lehoz egy óriás (vagy ha volt)

Szóval ... Segítség a világot megszabadítsuk IE6 egy sorban a javascript!

http://code.google.com/p/sevenup/

Ha css személy, akkor tudni fogja a fájdalmat abban, hogy a kereszt elrendezésben dolgozik böngészővel. IE8 még egy kulcs a fejlesztők nekünk dolgozik. Anywaz! ha bejön ez a kérdés fel, mint én tegnap, ahol a tökéletesen működő CSS IE7 (és korábbi) és a Firefox is hirtelen elkezdett dobott hisztizés IE8, próbáld ki ezt ... Úgy tűnt, szépen leviszi a problémákat a pillanatban ....

A Meta nyilatkozatot, tudjuk meg a renderelő motort szeretnénk IE8 használni. Tehát kényszeríteni IE8 mint IE7 teheti be a következő ... metataget vezetője a dokumentum: -

<meta http-equiv="X-UA-Compatible" content="IE=7" />

Alapértelmezésben IE Meta lenne: -

<meta http-equiv="X-UA-Compatible" content="IE=8" />
amely tenné IE8 teszi az oldalt az új szabványok mód.

Ha szükséges, ez a forma lehetne használni elszállásolásáról, más böngésző használata az alábbiak szerint:

<meta http-equiv="X-UA-Compatible" content="IE=8;FF=3;OtherUA=4" />

Részletes DOCTYPES:

HA Ön még nem ismeri a fajta állat úgynevezett "doctype" ... itt van néhány gyors olvasási
Mik DOCTYPES? Milyen furcsa szokásai és a böngészõ szigorú mód?
DOCTYPE beállítása XSL

Egy alaposabb ismeretek DOCTYPES, keresse ezeket a linkeket ...
A List Apart: Csináld meg a helyét a jobb DOCTYPE!
A List Apart: Beyond DOCTYPE: Webes szabványok, előre kompatibilitás, és az IE8

Megjegyzés: bár sokan HTML / CSS emberek már elhanyagolja a fontosságát DOCTYPE decleration a mi dokumentumokban, A megfelelő DOCTYPE, általában a válasz, hogy a legtöbb böngésző több kérdés.

CSS nem IE böngészők: A hír az, hogy a fejlesztők CSS, CSS Selectors gyermek, mint az alábbi példa, úgy tűnik, nem működik IE-ben.

pl div> span {} némi css, azt jelenti, hogy "amikor a span elem egy gyermek (és nem egy unoka, vagy nagyon nagy gyermeke stb), a szétválás elem".

De használta ezt a CON, hogy az előnyünket. Történelmileg, a gyermek választó már, hogy elrejtse CSS-parancsok IE. Egyszerűen azáltal, hogy html>body elé olyan CSS parancs IE figyelmen kívül hagyja:

html>body .foo { CSS commands go here ;}

Ez működik, mert <body> mindig gyermeke <html> - ez persze soha nem lesz unoka vagy dédunoka a <html> .

Most, hogy IE 7 megérti a gyermek választó, akkor be kell helyeznie egy üres megjegyzést címke után közvetlenül a nagyobb jel. IE 7 majd nem értik ezt választó (ki tudja miért!?), És ezért teljes mértékben figyelmen kívül hagyják ezt CSS parancsot:

html> /**/ body .foo { CSS commands go here ;}

Ha még nem láttam ezeket korábban, van olvassa el a következőket is

• Feltételes Megjegyzés: Az Ön csak IE-rész Duex
• CSS hack: Javascript, CSS, HTML Firefox csak
• Az Ön csak IE

Mint általában, az egyik a sok furcsa probléma IE és ez kell a soraiban TOP 10 IE Quirks.

PROBLÉMA NYILATKOZAT (Ez volt az én problémám, lehet, hogy hasonló misbehaviors):
Nekem van sok DIV van az oldalon osztályú "sectionhead", amely nem más, mint a címe egy szakaszt az oldalon. Szóval van pár stílus ehhez hasonlóan néz ki

. Sectionhead {font-size: 18px; background: # cfcfcf; padding: 5px;}

A div egy világosszürke bár néhány fekete szöveg. Mi történik az IE néhány ilyen szakasz fejlécek jelennek meg ok, de néhány láthatatlan, amíg lapozunk az oldalon, vagy kattintson az oldalon valamit, stb Néha hajlamosak eltűnni, ha rákattint az "Alt" billentyűt, amikor a Page Down vagy lapozzunk a görgetősáv. Néha úgy tűnik, újra megjelenik, ha a Frissítés (F5) az oldal. Én rövid tökéletesen egyszerű DIV néhány egyszerű stílusban viselkedik rossz.
Mit okozhat egy ilyen kiszámíthatatlan viselkedése? Nos! Őszintén szólva, fogalmam sincs!

LEHETSÉGES MEGOLDÁS:
Megint ne kérdezd, miért, de sok esetben ez a probléma általában eltűnnek, ha hozzá helyzet: relatív az MIS viselkedő elemek stílusban, mint ez a

. Sectionhead {font-size: 18px; background: # cfcfcf; padding: 5px; helyzet: relatív}

Furcsa, de mit mondjak? Isten áldjon meg engem IE!

ÉS osztozik az Egyesült Államokkal, Ha lenne hasonló problémákkal.

Hát igen! A korábbi követő néhány napon belül vissza illetően homály IE8, elfelejtettem megemlíteni egy fontos pont, hogy "IE 8 szigorú mód nem teszi lehetővé a CSS homályosság".
Azok számára, akik donot érteni, mire gondolok a szigorú mód, itt gyors bemutató .

Egy mű körül, hogy ezt (IE fejlesztői csapatának előtt veszik észre, hogy már kövezett út újbóli munkarutin a világ minden tájáról, a web-oldalak segítségével Pop-up albumok némi homály, és tegye vissza támogatása Opacity) az, hogy egy félig átlátszó kép ... lehetőleg PNG formátumban (volt már rossz tapasztalata egyre átlátszó GIF képeket ugyanúgy működik, mint kellett volna). Hozzon létre egy PNG képet a szín és az átláthatóság százalékos tetszik, az a kedvenc képszerkesztő, és használja azt háttérképét Kedvencek overlay.

azaz
Ahelyett, hogy valami ilyesmit

. Lighbox_overlay {
background-color: # ffffff;
z-index: 1001;
-Moz-opacity: 0,6;
opacity: 0,60;
filter: alpha (átlátszatlanság = 60);
}

Tegye ezt ....

. Lighbox_overlay {
background: url (bkg.png) repeat;
}

Próbálni, KATTINTSON IDE! | letölteni, KATTINTSON IDE!

Ha megnyitja ezt az oldalt IE8, akkor be kell látni a teljes átlátszatlan, fehér háttér mögött ezen a poszton. Tegnap, az én kollégám rámutatott erre, hogy nekem (Ahogy én egyike vagyok azoknak, akik alkalmazkodni a változásokhoz lassan és folyamatosan ... főleg böngészőkben. Mondhatnánk, Im gyáva, de hát legyen .... Mivel egy UI fejlesztő vagyok, mindig szar félek az új verzió böngésző ... tudod mit Im tlaking szó, ugye?)

Ástak körül, miközben, megpróbálja megtalálni a megoldást, javítsa ki és akkor mi ...
Ezúttal mi BÁRMIKOR KEDVENC böngésző nem tette meg újra a csepegés mindegyike támogatja a CSS áttetszőségét. A nem szabványos `filter: alpha (fedettség = # #)` CSS tulajdonság el lett távolítva, Nizza, de ők is teljesen elfelejtettem hozzá CSS3 támogatás fedettség (mint például hogyan összes többi böngésző szépen megtartották azt.) Így óta először Isten azt mondta nekünk a CSS átlátszatlansága (hiszen IE 5.0, azt hiszem), a web böngésző nem támogatja a CSS-fedettség.
És most a krém tetejére: Hivatalos szót IE 8 csapat? Ez "by design" és a "fogjuk vizsgálni ezt egy későbbi változatát IE."

PS: Próbáld ki ezt az oldalt FF, esküszöm, úgy néz ki, ügyes!

Ha valaha készült (vagy hogy 1) egy függőleges menü segítségével listaelemek (li) címkék és a CSS, akkor szembesülhet, ez egy újabb hiba az Internet Explorerben, ahol IE 6 betétek eltéréseinek lista elemeit tartalmazó blokk szintű elemeket, vagyis ha van szóköz között a lista elemeit a jelölést. Kösz, de kösz, az IE 7-es verzió úgy tűnik, ez a hiba mentes.
Ha, mint én, és még sok más, Ön ebbe a csapat csalódott fejlesztők, akik még, hogy az új elrendezést, az IE6 is dolgozik, akkor ez hasznosnak bizonyulhat. Vessen egy pillantást ...

Minta jelölés:

<ul id="menu">
<li> <a href="#"> Kezdőlap </ a> </ li>
<li> <a href="#"> ról </ a> </ li>
<li> <a href="#"> Szolgáltatások </ a> </ li>
<li> <a href="#"> Portfolió </ a> </ li>
<li> <a href="#"> GYIK </ a> </ li>
<li> <a href="#"> Kapcsolat </ a> </ li>
</ Ul>

Lehet, hogy hozzon létre egy CSS, hasonló, mint alább, hogy a fenti jelölés transfrom egy vertikális menüt ....

Minta CSS ...
# Menu {
margin: 0; padding: 0; background: # FF9900;
list-style-type: none; szélesség: 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;
}

Az eredmények azt fogja látni ...

Megoldás ezt a hibát ... (módosított / hozzáadott CSS félkövér dőlt)

# Menu {
margin: 0; padding: 0; background: # FF9900; list-style-type: none; szélesség: 150px;
float: left; / * ez lebegett a lista elemeit tartalmazza * /
}
# Menu li {
margin: 0; padding: 0;
float: left; / * Ez a javítás a * /
szélesség: 100%; / * whitespace bug az IE6 * /
}
# Menu a {
display: block; color: # 555555;
text-decoration: none;
padding: 0 15px;
line-height: 2,5; border-bottom: 1px solid # FFF;
}

Ha a fenti megoldás doesnot működne (ismert okok miatt csak IE6) ... próbáld inkább ezt a módszert

Csak add ezt a kiegészítő csak IE6 stílust a jelölések ...

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

Hozzászólás IE 6, MSIE volt olyan kedves, hogy minket a fejlesztők UI hozzáadásával még néhány CSS tulajdonságok szabvány legtöbb szabványos böngészőkben. Az egyik ilyen hasznos tulajdonság "min-height". Szép egyenes továbbít tulajdonsága, amely nem igényel hosszú magyarázatot kifulladt. Amikor egy min-height egy részlege van beállítva, hogy mindig fenntartja, hogy a beállított magasság, ha a tartalom is kisebb helyet foglal, mint a házakat képes tárolni és a fontosabb (ellentétben a plain vanilla "height" tulajdon) mérlegek vagy CSS szavakat, akkor úgy viselkedik, mint egy részlege, amelynek "magassága" beállítása "auto" ...

Másoknak közülünk szegény fejlesztők, akik még mindig van szükség, hogy a CSS kódot is dolgozniuk kell az IE6, az ENSZ-elérhetőségét a "min-height" bizonyulhat hazavágja valamikor ... Donot kétségbeesés.

Szerencsére, van elég furcsa szokásai az IE-ben, hogy mi lenne arra használni, hogy előnyös, és csapkod a végig, hogy elérjük azt a célt ... azaz, hogy az osztály részlege, mintha a min-height az IE6

1. megoldás: A aláhúzás Hack [ ... Bővebben ]

.box1 {
min-height: 200px;
height:auto;
_height:200px;
}

HTML: -
<div class="box1">Some dynamic content with variable height ...</div>

---

2. megoldás: A CSS attribútum szelektor Hack

.box2 {
min-height:200px;
height:200px;
}
div[class] .box2 {
height:auto;
}

HTML: -
<div class="someclass">
<div class="box2 common">Some dynamic content with variable height ...</div>
</div>


A CSS attribútum szelektor Hack kihasználja azt a tényt, a böngészők figyelmen kívül hagyja a korábbi tha IE6-1 attribútum a felhasznált választó. Megjegyzés: a követelmény másik tartályba szétválási class = "someclass". Csak a presense az osztály attribútum ezt a felosztást, felülírja az automatikus magasság vissza az Opera, Mozilla és MSIE7 majd. IE6, ami nem támogatja attribútum a felhasznált választókkal, figyelmen kívül hagyja azt.

Demo megtekintése a min-height csapkod IE6

Több alkalommal, eközben oldalelrendezések felugró megosztottságot / albumok / etc Tippek találkozhatunk olyan helyzetekben, amikor valamilyen formában SELECT tárgyak történik, hogy az e POPUP osztályok, tervezési és ez átüt .... Yuk!

Nos! akkor könnyen kijavítani ezt beállítani a z-index értékeket megfelelően az FF és az IE7. De a jó öreg (szójáték szándékozott) IE6 nem úgy viselkedik, mint szánták .... A legördülő lista segítségével mutatják, még azután is alkalmaz valamilyen drasztikusan magas z-index értékeket a popup osztály ... A fenébe!

Jelenleg nem jelentek meg javítások ezt a problémát, de vannak, azt hiszem, több, mint néhány munkába menet-körül ez a probléma, de Im itt, hogy elmondjam a legegyszerűbb megoldás, hogy használjam, ami jól működik nekem, a legtöbb esetben ....

"Elrejtése ROUGE SELECT listában, akkor megjeleníti a POPUP"

Egyszerűen a script kódrészletet mutatni, ahol a popup, adjunk hozzá egy darab szkriptet láthatóságát beállítja a legördülő lista a "Rejtett"

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

És ne feledd, hogy állítsa vissza a Close a PopUp osztály

document.getElementById ('my_select "). style.visibilty =" látható ";

ahol "my_select" az ID-irritáció SELECT Box

Remélem ez segít ...

PS. Vannak persze más lehetőségek, mint dinamikusan positionining IFRAME-ben (akkora, mint te PopUp) a Popup DIV ... Ez jól működik is, de egy hozzáadásával rengeteg DOM elemek, szkriptek és fejfájás. Én használtam ezt a megoldást is, és ha mégis segítségre van szüksége ezzel az opcióval, ne szólj. Szívesen segítünk!