Das einfachste wär wohl für jeden Browser einen eigene CSS-Datei zu laden.
CSS Menu IE vs. Firefox
hmmm dachte mir schon sowas...wollte aber nicht aufgeben...naja...ist wohl das beste.. weist du wo ich eine anleitung dafür bekomme? infos für den einbau?
Ja, über die Suchfunktion.
Diese Frage gabs schon mehrmals. Gestern zb. wurde was in der Richtung gefragt.
Firefox und IE behandeln die Höhe unterschiedlich: Firefox nimmt die Höhe exklusiv Padding und IE inklusiv Padding.
Um bei beiden die gleiche Höhe zu erhalten machst Du es am besten so:
Du erstellst die CSS normal für Firefox und erstellst dann mit dem Sternchen-Hack die Regel für IE, indem Du das Padding für oben und unten zur Höhe dazu addierst.
Beispiel:
li { padding-top: 15px; padding-bottom: 25px; height: 50px }
*html li {height:90px} // 50px+15px+25px=90px, das *html bewirkt, dass nur IE diese Definition befolgt.
... dann mit dem Sternchen-Hack die Regel ...
Genau deshalb empfehle ich 2 verschiedene CSS-Datein: Mit dem IE6 mags ja funktionieren, aber wie wir IE7 (IE7+SP1, IE8, ...) dann die Hacks interpretieren?
Stimmt. Die bevorstehende Version 7 verdränge ich so gerne aus meinem Kopf. Microsoft hat ja schon angekündigt, dass IE7 die alten Hacks ignoriert. Da muß das dann so aussehen:
<!--[if IE]>
<style>
li
{
height: 90px;
}
</style>
<![endif]-->
ok danke leute...also mache ich mal zwei css files....oder wechsle wieder zu table layouts 😉
Muss ich die ganze Zeit hinter euch aufräumen?
Vor 2 Tagen hatten wir dieselbe Frage.
#44297
@woida: Das mit den 2 verschiedenen CSS-Files ist überhaupt nicht das einfachste, braucht Zeit und ist völlig unnötig.
Also - jetzt zum letzten Mal:
Dass sich IE und Firefox unterschiedlich verhalten stimmt. Aber nur im QuirksModus.
Eine gleiche Darstellung kann man mit der richtigen Doctype-Setzung erzielen.
Ist der richtig gesetzt gehen IE und Firefox in den StandardsMode und die Interpretierung von CSS ist zu 99% gleich (auch das verdammte Box-Modell).
http://www.stichpunkt.de/css/css-tipps.html#doctype ("darum ist der doctype wichtig...")
musst nicht aufräumen...schon gelesen...ist aber keine garantie das es funktioniert...
page {
config.doctype = xhtml_trans
#config.doctype = xhtml_strict
#FOR IE
config.doctypeSwitch = 1
config.xhtml_cleaning = all
xmlprologue = none
etc
bringt nichts....ie = chaos
star27 schriebmusst nicht aufräumen...schon gelesen...ist aber keine garantie das es funktioniert...
Ich kenne genau 2 Fälle (die wirklich in Seiten vorkommen) in denen es Probleme gibt.
Der eine ist dass margin-Abstände im IE verdoppelt werden wenn zwei gefloatete Boxen nebeneinanderstehen. (lässt sich leicht durch eine display:inline; Anweisung auf alle Boxen die du mit Float definiert hast beheben. - Hat sonst keine Auswirkung aufs Design da Float-Objekte automatisch Block-Elemente sind)
Der zweite Bug betrifft eine falsche Positionierung von Labels in Formular-Fieldsets.
http://www.thestyleworks.de/tut-art/ie7.shtml (die bekannten IE Bugs und wie/ob sie in IE7 behoben wurden, bzw. wie man sie umgehen kann)
Wie sieht dein Doctype aus? Wenn er wie folgt aussieht funktioniert es auch - glaub mir ich hab schon viele Seiten erstellt, jeweils mit genau einem CSS-File.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<?xml version="1.0" encoding="iso-8859-1"?>
Meine Default-TS sieht übrigens so aus (ohne Spracheinstellungen):
###### DEFAULT CONFIG #########
############################
config.doctype = xhtml_trans
config.xhtml_cleaning = all
config.htmlTag_langKey = de
config.removeDefaultJS = 1
config.disablePrefixComment = 1
#to clear msie xml-to-quirksmode bug
[browser = msie]
config.doctypeSwitch = 1
[END]