2009 7. november 2009

CSS ZOOM - Še en IE Šala; 3 pixel shift

Čas in znova, ko so vsi drugi brskalniki videli, da se obnašajo, kot je povedal, pravila W3C, tj če spiral iz nje razvojnega duha z metanje Tantrum, da se ne zdi, da imajo popraviti. Samo tako je ena to vprašanje v IE7.

Problem Izjava:
I in bi tako veliko drugih hudih spletni razvijalci so opazili več kot Veliko krat, da če obstaja ugnezdenih lebdi v razporeditvi, na hover nad nekaterimi povezavami (sidro oznake), ki vsebuje posoda se zdi, da premik nekaj pik v desno . Poskušal sem na google za rešitev tega vprašanja, vendar pa so se komaj našla primerne odgovore na zakaj in kdaj se pojavi (ki lahko pomaga preprečiti te težave ne bi zgodilo), zato še nisem našel jasne rešitve problema niti ...

Možna rešitev:
Iz izkušenj, imam obvestilo 90-odstotni odstotkov krat, to pomeni, da je to vprašanje določi z dodajanjem zoom lastnost pri opredeljevanju CSS v napačno obnaša posodo ...

 # Somediv {
       zoom: 1;
 }

spet so razlogi so dvoumno ... poskusite to ...
Nekateri elementi v IE imajo "hasLayout" premoženje, ki je "resnična", ki ga privzeto. Veliko vizualnih CSS vedenja, na primer alfa filter deluje samo na element, ki hasLayout. in {Zoom: 1} Zdi se, da ciljne elementa v hasLayout premoženja .... Koristne? Jaz dont mislim tako ...

Zoom lastnost je tudi zdi, da podpira Chrome, vendar je njegova uporaba Trud se zdi, da veliko škodljivega učinka na mojo postavitev ... poskusiti, če deluje za vas ... če ne, zaznamek to stran pod "craps CSS"


2009 22. marec 2009

SevenUp! Spodbujajte svet, da se znebite IE6!

Google se začne gibanju takojšnje ljudi, da smetišče IE6 ... Z bugging IE6 uporabnike POPUP od obremenitve strani ... naj ne bo lahko zelo dobra ideja ... ampak da razvijalec UI, moram pridružiti tej pasu vagon ... eno manj brskalnik zame skrbeti Žal mi je ... sebično je! vendar sem se vključi ta javascript ... (poskusite to stran v IE6) ...
Hej! in na svetlejšo noto ... Glej, da je prikaz moči JavaScript .... da lahko celo znižajo velikana (ali ko je bilo)

Torej ... Pomoč osvoboditi svet IE6 z eno vrstico javascript!

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


2008 17. december 2008

Mis-IE8 vedel: CSS postavitev lome (usmerjenost na spletno različico z Meta Tags v IE8)

Če ste oseba, css, pa ti veš, bolečine v pridobivanje vaš postavitev delovne navzkrižno brskalnik. IE8 je še en ključ v del za nas razvijalce. Anywaz! Če ste zadeli na to vprašanje, kot sem storil včeraj, kjer je vaš popolnoma deluje CSS v IE7 (in prej) in Firefox nenadoma začeli metati tantrums v IE8, poskusite to ... To lepo zdelo, da se določi moje težave za zdaj ....

Uporaba izjava Meta, lahko določite upodabljanja motor, mi bi radi IE8 za uporabo. Tako prisiliti, da postane IE8 v IE7 ... vstavite naslednjo oznako Meta v glavi dokumenta: -

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

Privzeto bi IE Meta je: -

<meta http-equiv="X-UA-Compatible" content="IE=8" />
ki bi IE8 zagotavljajo, da je stran z uporabo nove standarde način.

Če je potrebno, bi se to sintaksa se uporablja za namestitev v drugih brskalnikih, kot spodaj:

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


VEČ O DOCTYPES:

Če ste še ne poznajo neke vrste žival, imenovano "DOCTYPE" ... tukaj je nekaj hitro branje
Kaj so DOCTYPES? Kaj so BROWSER quirks in strogem načinu?
Nastavitev DOCTYPE v XSL

Za bolj poglobljeno razumevanje o DOCTYPES, poskusite obiskom te povezave ...
Seznam Apart: Fix vaše spletne strani z desno DOCTYPE!
Seznam Apart: Beyond DOCTYPE: Spletni standardi, Forward združljivost in IE8

Opomba: Čeprav mnogi od nas HTML / CSS ljudje so zanemarili pomen VrstaDok decleration v naših dokumentih, v katerem pravi DOCTYPE, je običajno odgovor na večino vprašanj, navzkrižno brskalnika.


2008 10. oktober 2008

NE Za samo za IE - CSS selektorji Otrok ne dela v IE

CSS za Non-IE brskalniki: Njena ni novic za razvijalce CSS, da CSS selektorji Child, kot je na primer spodaj, ne zdi, da dela v IE.

npr div> span {nekaj css}, to pomeni, da "ko span element je otrok (in ne vnuk ali super grand otrok itd) ob delitvi elementa".

Ampak smo to konvencijo v našo korist. V preteklosti je bil otrok selektor uporablja za skrivanje CSS ukazov od IE. Preprosto z dajanjem html>body se bo pred vsako CSS ukaz IE prezreti:

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

To deluje, ker <body> je vedno otrok <html> - to seveda ne more biti nikoli vnuk ali pra-vnuk od <html> .

Zdaj, ko IE 7 razume otrok izbiro, boste morali vstaviti prazno oznako komentarjev, v neposredno po več kot znak IE 7 pa ne bo razumel to izbiro (kdo ve zakaj!?) In bo zato v celoti prezreti ta ukaz CSS.:

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

Če še niste videli to prej, imajo preberete tudi naslednje


2008 4. oktober 2008

Izginjajo HTML / DIV elementi v Internet Explorerju [IE]

Kot ponavadi, eden od mnogih nekaj čudnih težav z IE in to treba je uvršča v TOP 10 IE quirks.

PROBLEM IZJAVA (To je bil moj problem, morda imate podobne misbehaviors):
Imam veliko DIV je na stran z razreda "sectionhead", ki je nič drugega kot naslov odseka na strani. Tako sem nekaj stil videti takole

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

Div je svetlo sivo bar z nekaj črno besedilo. Kaj se zgodi v IE, je nekatere od teh odsekov glave so prikazani v redu, nekateri pa so nevidni, dokler se pomikate po strani ali pa kliknite na nekaj strani, itd Včasih se nagibajo k izginili, ko boste kliknili na tipko »Alt želiš, ko stran navzdol ali se pomaknite z drsnega traku. Včasih se zdi, da znova pojavijo, ko osvežite (F5) strani. Skratka sem popolnoma preprosta DIV z nekaj preprostega stila obnaša BAD.
Kaj bi lahko povzročilo takšno nenadzorovano vedenje? No! Odkrito povedano, pojma nima!

MOŽNA REŠITEV:
Še enkrat, ne sprašuj me zakaj, ampak v veliko primerih ta problem ponavadi izginejo, ko dodate položaj: v primerjavi z MIS z vedenjem elementov slog, kot to

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

Čudno, ampak kaj naj rečem? Bog me je Bless od IE!

IN DO DELEŽ z nami, če bi imeli podobne težave.


2008 15. julij 2008

IE 8 strog način in CSS opacity ... izognete

Oh No! V prejšnji post nekaj dni nazaj glede motnosti v IE8, sem pozabil omeniti pomembno točko, da "IE 8 strog način ne dopušča CSS motnosti".
Za tiste, ki donot razumeli, kaj mislim s strogim načinom, tukaj je hiter tutorial .

Delo okoli, da je to (pred ekipo IE dev zavedajo, da so utrli pot za rutino ponovno dela po vsem svetu, na spletnih straneh, ki uporabljajo Pop-up lightboxes z nekaj motnosti, in dal nazaj podpore za motnost) je, da uporabite pol pregledno sliko ... po možnosti v formatu PNG (sem imel slabe izkušnje dobili prosojne slike GIF na delo, saj so bili naj bi). Ustvarite sliko PNG za barve in odstotek preglednosti ti je všeč, v tebi najljubši urejevalnik slik in jo uporabite kot ozadje za svoj osebni album prekrivni.

tj
Namesto da bi kaj takega

. Lighbox_overlay {
Ozadje-color: # FFFFFF;
z-indeks: 1001;
-Moz-opacity: 0,6;
motnost: 0,60;
filter: alpha (opacity = 60);
}

Ali je to ....

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

Če želite poskusiti, KLIKNITE TUKAJ! | NA PRENOS, KLIKNITE TUKAJ!


2008 6. julij 2008

Ne "Prosojnost" v IE8

Če si ogledujete to stran v IE8, morate biti videti popolno neprozorno belo ozadje zadaj to delovno mesto. Včeraj je moj collegue je na to opozorila, da me (kot sem jaz eden izmed tistih ljudi, ki se prilagodijo na spremembe počasi in vztrajno ... predvsem brskalnikov. Bi rekli, Im strahopetec, ampak tako je to .... Kot razvijalec UI, sem vedno sranje strah nove različice brskalnika ... veš, kaj Im tlaking okoli, kajne?)

Kopa približno za nekaj časa, poskuša najti rešitev, da to popravimo, in kaj potem ...
Tokrat je naša ALL TIME Priljubljen brskalnik uspelo znova ga spustite vso podporo motnosti CSS. Nestandardne 'filter: alpha (opacity = # #)' CSS atribut je bil odstranjen, Nice, ampak tudi povsem pozabil dodati CSS3 motnosti podporo (na primer, kako je vse drugo brskalnik lepo so jo hranijo v). Torej, prvič, ker nas je Bog povedal o CSS motnosti (od IE 5.0, se mi zdi), spletni brskalnik ne podpira CSS motnosti.
In zdaj za smetano na vrhu: Uradni beseda iz IE 8 ekipe? To je "by design" in "bomo, da je to v prihodnji različici IE".

PS: Poskusi to stran v FF, prisežem, da izgleda lepo!


2008 20. junij 2008

Bela Vesolje Bug v postavk / Seznam (li) v IE6

Če ste doslej (ali pa kar eno) vertikalnim Meni uporabo elementov seznama (LI) oznake in CSS, lahko naletite, je to še ena napaka v Internet Explorerju, kjer IE 6 vložki teh razlik med elementov seznama, ki vsebujejo elemente na ravni blokov, ki se pravi, če obstaja kakršen koli presledke med seznamom postavk v pribitkom. Hvala, ampak ne hvala, različica IE 7 se zdi, brez tega hrošča.
Če, kot sem jaz in še veliko več, lahko spadajo v to skupino od frustriranih razvijalcev, ki še vedno imajo, da bi dobili svoje nove postavitve, ki delajo v IE6 preveč, potem bi to lahko izkaže za koristno. Oglejte si ...

Vzorec oznake:

<ul id="menu">
<li> <a href="#"> Home </ a> </ p>
<li> <a href="#"> O </ a> </ p>
<li> <a href="#"> Storitve </ a> </ p>
<li> <a href="#"> Portfolio </ a> </ p>
<li> <a href="#"> Pogosta vprašanja </ a> </ p>
<li> <a href="#"> Kontakt </ a> </ p>
</ Ul>

Morda boste ustvarili nekaj CSS, podoben spodnjemu, da transfrom zgornje oznake v navpičnem meniju ....

Primer CSS ...
# Menu {
margin: 0; padding: 0; background: # FF9900;
Seznam-style-type: none; širina: 150px;
}
# Meni li {margin: 0; padding: 0;}
# Menu {zaslon: block;
color: # 555555;
text-decoration: none;
padding: 0 15px;
line-višina: 2,5; meja bottom: 1px solid # FFF;
}

Rezultate boste videli ...
null

Rešitev za to napako ... (spremenjene / dodane CSS s krepkim poševnim tiskom)

# Menu {
margin: 0; padding: 0; background: # FF9900; seznam-style-type: none; širina: 150px;
float: levo; / * ta vsebuje zraku spisek izdelkov, * /
}
# Meni li {
margin: 0; padding: 0;
float: left; / * Ta določa * /
širina: 100%; / * presledke napako v IE6 * /
}
# Menu {
Zaslon: blok; color: # 555555;
text-decoration: none;
padding: 0 15px;
line-višina: 2,5; meja bottom: 1px solid # FFF;
}

Če je zgoraj rešitev doesnot zdi, da dela (zaradi znanih le IE6) ... poskusite to metodo namesto

Dodajte to dodatna IE6 le sloge za vaše pribitkom ...

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


2008 12 april 2008

CSS Cross Browser Minimalna višina Hack

Objavi IE 6, je MSIE že tako prijazen, da nam UI razvijalci z dodatkom nekaj več CSS lastnosti standardnih za večino drugih standardnih brskalnikih. Ena taka uporabna nepremičnina "min-višine". Lepo naravnost naprej premoženje, ki ne potrebuje dolgo daha pojasnilo. Ko je nastavljena min-višina za delitev, je vedno ohranja to nastavljeno višino, ko vsebina je v njem zaseda manj kot lahko ima in pomembno je (za razliko od navadnega vanilije "Višina" lastnine) lestvice ali z besedami, CSS, da se vede kot delitev, katerih "Višina" nastavljen na "auto" ...

Za nekatere od nas revnih razvijalcev, ki so še vedno potrebni za kode CSS, da mora prav tako delajo v IE6, bi lahko un-dostopnost "min-višina", dokazati kažejo zamašek nekje ... donot obup.

Na srečo imamo dovolj quirks v IE, ki bi jih uporabljamo v korist ven in kramp našo pot skozi, da dosežejo svoj ​​cilj ... to je, da je delitev delitev, kot da njegova min-višina v IE6

Rešitev 1: Uporaba poudarjajo Hack [ ... Preberi več ]

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

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


Rešitev 2: Uporaba atributa CSS Selector 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>

Atribut CSS Selector Hack izkorišča dejstvo, da brskalniki prej tha IE6 prezreti tudi atribute, izbiro. Bodite pozorni na zahtevo po drugi posodi delitve z class = "someclass". Samo presense razrednega atributa za to delitev, preglasi višine nazaj v avto za Opera, Mozilla in MSIE7 in kasneje. IE6, ki ne podpira atribute selektorji, ga ignorira.

Oglejte si demo min-višina kramp za IE6



2008 15. marec 2008

Draži Izberite Škatle viden skozi pojavnem oddelkov

Ob različnih priložnostih, medtem ko delaš postavitve strani z popup oddelki / lightboxes / Nasveti itd srečamo primere, ko neko obliko Izberi predmete zgodi, da je v teh Popup oddelkov, pri načrtovanju in kaže skozi .... Yuk!

No! da bi lahko z lahkoto popravite tako s prilagajanjem vaše Z indekse vrednosti primerno za FF in IE7. Dobro, ampak star (pun namenjena) IE6 ne obnašajo kot je bilo predvideno .... SELECT BOX kažejo skozi, tudi potem, ko ste uporabili nekaj drastično visoke Z indekse vrednosti ... tvoj PopUp Division Bummer!!

Ni določa za to težavo, vendar je po mojem mnenju, več kot nekaj poti v službo, to težavo, vendar im tukaj, da vam povem najpreprostejšo rešitev, ki ga uporabljam, ki deluje dobro za mene, v večini primerov ....

"Skrivanje Rouge SELECT polja, ko prikažete POPUP"

Preprosto v vašem scenarija izrezek, kjer pokažete svoje ljudstvo, dodamo košček scenarij za določitev prepoznavnosti oknu Izbira na "skritih"

document.getElementById ("my_select) style.visibilty =" skrito ".;

In ne pozabite, da ga je nazaj na koncu vašega pojavnih oddelka

. document.getElementById ("my_select) style.visibilty =" vidni ";

kjer "my_select" je ID za draženje oknu Izbira

Upam, da to pomaga ...

PS. Obstajajo tudi druge možnosti, kot gredo zraven dinamično positionining tudi IFRAME (enake velikosti, kot ste PopUp) v pojavnem DIV ... To dobro deluje preveč, vendar z dodatkom kupe DOM elementov, skripte in glavobolom. Imam uporabljajo to rešitev, preveč, in če vam potrebujete pomoč pri tej možnosti, pa mi sporočite. Bodo z veseljem pomagali!


NDK domov | Ki ga izraža | Izražanje Okus | Izražanje Penmenship | Izražanje Awe | Izražanje Sebe