#1 30. September 2010 CSS Anzeigefehler IE Moin moin Ein Kumpel hat sich an mich gewandt. Er hat mit irgend nem Homepage-Maker eine Seite erstellt. Schlicht, aber sieht dennoch gut aus. Firefox und Opera stellen die Seite top dar, der Internet explorer verfälscht jedoch die Menüschrift sowie den Hover! Hat jemand ne idee? Der Style ist direkt in die HTML-Dateien eingebunden: Code: <style type="text/css">html, body { height: 100%; margin: 0px; padding: 0px; } body { background-image: url(./userfiles/tplImages/bg.jpg); background-color: #8b8b8b; background-repeat: repeat-x; background-position: top; } body,td,div { font-family: Verdana, Arial, Helvetica, Tahoma, sans_serif; font-size: 12px; color: #333333; } #p3_tplSiteArea { width: 100%; height: 100%; } #p3_tplHead { height: 81px; padding-top: 0px; vertical-align: top; } #p3_tplNav { height: 32px; } #p3_tplMain { vertical-align: top; padding-top: 5px; padding-right: 5px; } #p3_tplSubL { vertical-align: top; text-align: center; width: 250px; padding-top: 50px; } #p3_tplSubR { vertical-align: top; width: 200px; border-left: 1px dashed #666666; padding-top: 5px; padding-left: 5px; } #p3_tplFooter { height: 31px; vertical-align: bottom; } .p3_navFrameStyle_19 { } .p3_navSubFrameStyle_19 { text-align: left; margin-top: 6px; margin-bottom: 6px; background-color: #191A1C; border-right: 1px solid #000; border-left: 1px solid #000; border-bottom: 1px solid #000; -moz-opacity: 0.95; -khtml-opacity: 0.95; filter: alpha(opacity=95); } .p3_navBoxStyle_19 { display: inline; margin-right: 20px; } .p3_navSubBoxStyle_19 { display: block; } .p3_navLinkStyle_19 { padding: 7px; display: inline-block; font-family: Tahoma, Verdana, Arial, Helvetica, serif; font-size: 12px; font-weight: bold; text-decoration: none; color: #ffffff; -moz-opacity: 0.20; -khtml-opacity: 0.20; filter: alpha(opacity=20); } .p3_navSubLinkStyle_19 { display: block; padding: 7px; font-family: Tahoma, Verdana, Arial, Helvetica, serif; font-size: 12px; text-decoration: none; color: #a9a9a9; } .p3_navLinkStyle_19:HOVER { background-color: #ffffff; padding: 7px; display: inline-block; text-decoration: none; color: #000; } .p3_navSubLinkStyle_19:HOVER { display: block; background-color: #cccccc; text-decoration: none; color: #000000; } </style> Die unteren müssten die betreffenden Problemfälle sein. Was mir aufgefallen ist, dort ist im Quelltext etwas kommentiert mit: Code: <!--[if lt IE 7]> <style type="text/css">.p3_navSubLinkStyle_19 {width: 100%;}</style> <![endif]--> <style type="text/css"></style><link rel="Stylesheet" href="./includes/styles/sitestyle.css"> In der genannten "sitestyle.css" steht nur drin: Code: BODY { margin: 0px; padding: 0px; font-family: Tahoma,Arial,Helvetica,Verdana; font-size: 12px; } A { font-family: Tahoma,Arial,Helvetica,Verdana; font-size: 12px; } Was muss nun getan werden, bzw was hat der IE da für ein Problem? Vielen Dank, BW selbstverständlich. + Multi-Zitat Zitieren
#2 1. Oktober 2010 AW: CSS Anzeigefehler IE es wird gesagt das HTML: font-family: Verdana, Arial, Helvetica, Tahoma, sans_serif; die schriftart verdana, ... sein soll jetzt wird aber gesagt bist du der ie >=7 dann mach HTML: font-family: Tahoma,Arial,Helvetica,Verdana; die schriftart tahoma also stellt der ie was anderes dar als alle anderen. + Multi-Zitat Zitieren
#3 1. Oktober 2010 Zuletzt von einem Moderator bearbeitet: 14. April 2017 AW: CSS Anzeigefehler IE Hallo Onip, danke erstmal für deinen Ratschlag. Die andere Schriftart stört nicht wirklich, viel eher stört die Schriftfarbe und der Hover. Sieht in etwa so aus: Links die Darstellung im IE ( falsch und dunkel ) Rechts im Firefox/Opera ( richtig und hell ) Hoffentlich hat noch wer nen Tipp oder nen Lösungsansatz -.- + Multi-Zitat Zitieren
#4 2. Oktober 2010 AW: CSS Anzeigefehler IE die einzelnen links haben die klasse .p3_navLinkStyle_19 ? dann wirds doch korrekt dargestellt. -moz-opacity -khtml-opacity filter: alpha(opacity=20) bewirken ja transparenz bewirken ja ein transparent effekt. + Multi-Zitat Zitieren
#5 3. Oktober 2010 AW: CSS Anzeigefehler IE Die Seiten werden so eingebunden: Hab die 3 Zeilen mal rausgenommen, die für die Transparenz sorgen. Leider keine Besserung. + Multi-Zitat Zitieren
#6 4. Oktober 2010 AW: CSS Anzeigefehler IE du sagst dem container .p3_navBoxStyle_19 das er transparent sein soll. alle inhalte darin werden auch transparent. + Multi-Zitat Zitieren
#7 4. Oktober 2010 AW: CSS Anzeigefehler IE Ich möchte ja keine Transparenz, sondern das weiße haben, wie oben im Bild! BWs erstmal raus. + Multi-Zitat Zitieren
#8 4. Oktober 2010 AW: CSS Anzeigefehler IE Code: -moz-opacity: 1; -wekit-opacity: 1; opacity: 1; filer: alpha(opacity=100); hebt die transparenz wieder auf. + Multi-Zitat Zitieren
#9 4. Oktober 2010 AW: CSS Anzeigefehler IE Danke, das hat schonmal geklappt. Hab die 3 Zeilen in die "sitestyle.css" eingefügt ( im body-bereich ), nun ist die Transparenz schonmal weg. Jetzt klappt der Hover noch nicht. Der soll ja den weißen Kasten erzeugen. Das muss ja nun auch irgendwie in die Sitestyle.css. Hab schonmal den entsprechenden Code aus den HTML-Dateien genommen, aber den frisst er nicht. Verstehe auch die "pseudo" IF-Anweisung nicht, warum der IE da extra die Weiterleitung an die Style.css bekommt. + Multi-Zitat Zitieren
#10 5. Oktober 2010 AW: CSS Anzeigefehler IE ich versteh das auch nicht, warum man das macht. ich mach das immer so für alle: HTML: #div { margin: 1px 2px 3px 4px; } für ie 6 HTML: * html #div { margin: 5px 6px 7px 8px; } für ie 7 HTML: * + html #div { margin: 9px 10px 11px 12px; } siehe CSS Filter Browserweiche per CSS // edit hier mal ein normaler hover HTML: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <title>Unbenannt</title> <style type="text/css"> a.link { display: block; float: left; padding: 4px 12px; } a.link:hover { background: #666; color: #fff; } </style> </head> <body> <a href="#" class="link">link 1</a> <a href="#" class="link">link 2</a> </body> </html> + Multi-Zitat Zitieren