Problemi z IE6 in IE7

Pozdravljeni!

Razvijam spletno trgovino na http://majiceso.in/ in imam velike probleme z Explorerjem 6 in 7.

Stran uporablja validiran xhtml in deluje skoraj v vseh browserjih (vključno z IE8). CSS ni (čisto) validiran.

Problem je v explorerju 6 in 7, kjer so artikli zlistani navpično. Pri podrobnem pogledu, pa so polja za izbiro parametrov spodaj, namesto desno.

  1. se da kaj narediti, da bo pravilno delalo še v teh dveh browserjih?
  2. so kakšne opcije, da pogledam, kako stvar deluje v vseh treh verzijah explorerja, na enem računalniku? Po možnosti z opcijo dostopa do localhost-a, kjer stvar razvijam. Nekoč sem uporabljal Multiple IE, ampak na Win7 ne dela. Je res edina opcija virtual machine za vsak browser?
  3. je v Google Analytics mogoče nastaviti/pogledati, s katerimi browserji uporabniki priletijo na stran "hvala za nakup"?
  4. Stran zgleda OK v manjših resolucijah (nekje do 1200), pri večjih pa so določeni elementi razmetani. Obstaja kakšna možnost emuliranja večjih resolucij na manjšem monitorju? To ni tako problematično, kot problem z browserji.

23 odgovorov

Huh, pri meni je 28% uporabnikov, ki uporablja IE6

Za test strani pa uporabljam IETester,v katerem lahko testiraš od IE5.5 do IE8.0 v enem programu, enostavno za vsako verzijo IE odpreš nov zavihek in vidiš kako stvar zgleda :)

Ko že pišemo o IE :) klik

Nekaj časa sem uporabljal za testiranje explorerjev tole:

http://www.microsoft.com/downloads/details.aspx?FamilyId=21EABB90-958F-4B64-B5F1-73D0A413C8EF&displaylang=en

je super zadeva in vsebuje pripomočke za debugiranje v explorerjih :o

Mogoce vam bo pomagala tale stran:
www.browsershots.org

Leon najbolje da narediš ie6.css in conditional comment za browserje starejše kot 7 (se pravi 6 in starejši, 5,4,3 ...) in po defaultu vsem floatanim elementom daš {display: inline;}, cca takole:

<!--[if lt IE 7]>
    <link rel="stylesheet" type="text/css" href="/css/ie6.css" />
<![endif]-->

Sicer pa za bojevanje z IE6/7 beri tole stran, pa tudi članek CSS Differences in Internet Explorer 6, 7 and 8 Smashing Magazinea ti bo prav prišel pri razumevanju jajca od 6ke in 7ke ;)

Davorin:
Leon najbolje da narediš ie6.css in conditional comment za browserje starejše kot 7 (se pravi 6 in starejši, 5,4,3 ...) in po defaultu vsem floatanim elementom daš {display: inline;}, cca takole:

<!--[if lt IE 7]>
    <link rel="stylesheet" type="text/css" href="/css/ie6.css" />
<![endif]-->

Sicer pa za bojevanje z IE6/7 beri tole stran, pa tudi članek CSS Differences in Internet Explorer 6, 7 and 8 Smashing Magazinea ti bo prav prišel pri razumevanju jajca od 6ke in 7ke ;)

potrebna je bila tale vrstica (ki je bila tam že prej ampak ni bil pravilen if)
<!--[if lt IE 8]><style type="text/css" media="screen">.artikel {display: inline;}</style><![endif]-->

Hvala, vsem skupaj. :D Dela zdaj tudi v IE6 in 7.

IETester, ki ga predlaga xymaan je sicer malo hroščat, ampak sem točno to iskal.

blackmamba:
To sem uporabljal do sedaj. Kje pa so pripomočki za debugiranje?

pri meni je obiskov iz IE 44,09%, iz IE6 12,46%

nisem si mislil da je tolk.. no končno sem nekako optimiziral tudi za IE, čeprav ni vse gladko..

hvala za orodje IETester..

a lahko mogoče kdo pogleda zakaj mi je na prvi strani vržen wrap čist na vrh, na ostalih pa je normalo pod temno rjavo vodoravno črto..

nevem ali je problem v css ali v html, če bi bil v css bi veljalo za vse strani a ne?

Če pogledam source dokumenta www.janel.si, vidim naslednji 2 stvari:
- prva vrstica je prazna vrstica
- druga vrstica je HTML komentar

Na tvojem mestu bi odstranil oboje, ker eno ali drugo zna IE6 prepričati, da bo renderiral tvojo stran v "quirks mode" in ne po XHTML 1.0 Transitional pravilih.

Torej: prva vrstica HTML dokumenta je vedno doctype.

je veliko pomagalo, ampak se vedno imam probleme z headerjem.. nevem rešit tega da skoči gor, ter zamika pri ozdaju headerja..

IE6 je mora za urejanje, še posebej zdaj, ko se je na trgu pojavlja vse več novih brskalnikov z vedno večjim trznim delezem.

Na sreco IE podpira poseben bomboncek, ki deluje brez podpore javascipta in sicer:
<!--[if IE]> <style type="text/css">@import "/skin1/IE-override.css";</style> <![endif]-->
Tale IF omogoča da za IE brskalnike uvedemo poseben CSS ali tag, ki popravi obliko.

Se pravi, najbolje da najprej pripravimo CSS za standardizirane brskalnike, nato pa dodajamo hacke za IE.

ja in tole delam že celoten čas.. če mi bo uspelo bo, če ne je pa čist vredu :P