[drupal] css en Internet Explore?

[MusicLisan]

Hallo allemaal,

Ik ben een website aan het maken voor iemand, alles werkte totdat ik de site probeerde te openen in IE (in chrome en firefox werkt de site wel). Ik ben er achter gekomen dat IE maar 31 css-files accepteert en de rest simpelweg negeert. Ik verwacht dus dat dit bij mij ook fout gaat.

Drupal heeft 2 modules om de css'en samen te voegen. Deze heb ik geinstalleerd maar dit lijkt ook niet te werken. Ook heb ik uit alle modules die ik niet gebruik, de css bestanden verwijderd zodat ik er misschien minder zou hebben. Ook dit werkt helaas niet.

Wanneer ik in de broncode kijk, zie ik wel dat een een if staat voor IE, dat deze naar een andere stylesheet wordt verwezen. Ik heb alleen niet echt het idee dat dit werkt.

Om een lang verhaal kort te maken: Hebben jullie een handigheidje zodat ook mijn site in IE gaat werken? Het gaat om de site: www.autorijschoolkenb.nl Ik heb deze al door de w3schools validator gehaald en hier komt 1 error uit die volgens mij het probleem niet kan zijn.

Alvast bedankt!

 

[csshunter]

Hoi Lisanne,
Je vraag staat al een pittige tijd open, zie ik. Drupal ken ik niet (behalve van horen zeggen), maar als ik de codes bekijk, zitten er 15.000 mogelijkheden in waarvan het grootste deel hier niet gebruikt wordt. Dat zal ook het geval zijn met de beschikbare css-bestanden.
Maar in de uiteindelijke code die de browsers te zien krijgen, zijn er maar twee css-bestanden die gebruikt worden. Daar kunnen de IE-storingen dus niet aan liggen.

Het if-ding in de code is een zogenaamd "Conditional Comment", een "voorwaardelijk commentaar". Dat is iets wat alleen IE begrijpt.

• In dit geval blijkt het te gaan om bug-fixes voor eerdere versies dan IE-7.
• Er had ook eigenlijk moeten staan: <!--[if lt IE 7]> ("lt" = less than).
• Maar wat er hier gerepareerd wordt, zijn de elementen met een id="sr2" t/m id="sr5". En die staan helemaal niet in de door jou op de pagina's gebruikte code.

Ik heb alleen niet echt het idee dat dit werkt.

Dat klopt dus helemaal: deze verwijsregel naar een speciaal stylesheet voor IE is loos, en kan er gewoon uit.

Wat is er dan wel aan de hand?
Het blijkt dat er in het gewone css-bestand met de lange naam http://autorijschoolkenb.nl/sites/default/files/css/css_61981c79e4c304dbeabf72b6c3e8b0e7.css een paar foutjes zitten.

• Dit kan gecontroleerd worden met de css-validator, een broertje/zusje van de html-validator.
• De css-validator zegt hier: 4 fouten ontdekt.
• Er staan een paar keer // in de code, wat niet goed is. Een dubbele slash is wel het begin van commentaar, maar niet in css (wel bv. in javascript). In css begint een commentaar met /* en moet het ook eindigen, met */
• Nu bestaan er geen vaste regels voor foutafhandeling van alle fouten die in de code gemaakt kunnen worden. Dat kunnen browsers vaak op hun eigen manier doen. Vandaar dat FF en Chrome iets anders te zien geven dan IE.

Conclusie: met wat aanvullende css moet het op te lossen zijn.
Klopt!

• Neem bv. deze kenb-nw.css.
• De fout-regels zijn er uit gehaald.
• De aanpassingen staan helemaal onderaan.
• Eigenlijk zou de hele code opgeschoond moeten worden, want er zitten wat dubbele dingen en tussentijdse veranderingen in. Maar zolang het eindresultaat werkt, hoeft dat niet perse.

Als je die download en in de plaats zet van die met de lange naam ...

• ... dan gebeurt er dit: www.developerscorner.nl/csshunter/tests/kenb-nw.htm
  (in de html-code is niets veranderd, alleen de verwijzing naar het nieuwe css-bestand)

Valid html, valid css, en ook toonbaar in IE6, IE7 en IE8.

Met vriendelijke groet,
CSShunter