Konditionelle CSS für IE7 / < IE7
 

Bin ein bestehendes Script am anpassen und mir fehlt offen gestanden ein wenig die Erfahrung mit diesen konditionellen Scripts. Diese fragen die Version des IE ab und erlauben es, individuelle CSS für die Versionen zu übergeben.

Hier mein Script, das im Head des HTMs drin steht. Der Knackpunkt liegt in der drittletzten Zeile mit dem top: 20px

<!--[if lt IE 7]>
<style type="text/css" media="screen">
body {behavior: url(csshover.htc); font-size: 100%;}
#menu ul li a {height: 1%;}
}
</style>
<![endif]-->
<!--[if IE] < 7>
<style type="text/css" media="screen">
#menu ul li {float: left; width: 100%;}
#menu ul {width: 0px;}
#menu ul ul {top: 20px;}
</style>
<![endif]-->

Meine Problematik liegt hauptsächlich darin, dass ich einen Wert für den IE 7 übergebe und dieser erst mal gar nicht drauf reagiert. Stattdessen spricht der 6er darauf an, obwohl ich den Wert nur dem 7er übergebe. Wahrscheinlich ist das Script irgendwie falsch gewickelt. Mein angestrebtes Ziel kommt übrigens im FF bestens zur Geltung. Da funktioniert nämlich alles zum Besten…

Danke für jedwelchen Input.

Uups, Du meinst wohl eigentlich <!--[if IE 7] >

Ahm, ehm…

Ich benötige eigentlich eine Bedingung, die mir

1. den IE 7 anspricht –> <!--[if lt IE 7]>

2. alle vorherigen Versionen anspricht. Meine Bedingung –> IE kleiner als 7 –> <!--[if IE] < 7>

Macht das Sinn? Schreibt man das so?

Um meinen Quelltext so frei wie möglich von IE-Hacks zu halten, weise ich per <!--[if IE]> allen IEs eine einzige CSS-Datei zu und arbeite innerhalb dieser mit den üblichen Hacks, d.h. ohne Hack für alle IEs (d.h. 5 bis 7), und mit Star-Hack für IE 5/6 etc. Das geht natürlich auch, wenn Du die CSS-Regeln im Quelltext belassen möchtest. In jedem Falle würde ich persönlich nie mehr als einen CC im Head haben wollen.

lt = "less than", also "kleiner als 7", also IE 5 & 6. Für ausschließlich IE 7 läßt Du das lt einfach weg.

Ne ;)

Oh du heilige Kuh! :shock:
Das "lt" hab ich gar nie richtig entschlüsseln können. Und hab daraus so allerlei Überlegungsfehler gemacht… Und dann stand die eckige Klammer noch falsch!

Es sieht jetzt so aus…

<!--[if lt IE 7]>
<style type="text/css" media="screen">
body {behavior: url(csshover.htc); font-size: 100%;}
#menu ul li a {height: 1%;}
#menu ul ul {top: 20px;}
}
</style>
<![endif]-->

<!--[if IE 7]>
<style type="text/css" media="screen">
#menu ul ul {top: 20px;}
</style>
<![endif]-->

… und ist zugegebenermassen nicht sehr elegant. Besser wäre eigenes IE-CSS. Das stimmt schon so. Zumindest funzt es jetzt wie es soll.

Danke für die schnelle Hilfe!

Ja, und selbst wenn Du die Hacks erstmal im Quelltext stehen lassen möchtest, geht auch das wie von mir beschrieben, und damit auch deutlich kürzer (hab's mal schnell zusammenkopiert und um den Star-Hack erweitert):

Es genügt ein CC statt zwei, und drei Regeln statt vier.

Nein, aber es geht so:

"lte" = "lower than and equal"

Und:

wäre für alle 6er und größer.

Gleichbedeutend mit <!--[if IE]> ;)

yop, aber wäre auch interessant für den Fall: <!--[if lte IE 6]> ;)