 funktionale Unterschiede zwischen Browsern |
|
Willkommen, Gast ( Anmelden | Registrierung )
HTML-Editor phase 5 Support > Fragen, Lösungen zu HTML-Problemen bzw. Webdesign-Fragen - Talk > HTML
 24.09.2010 - 16:08
Beitrag
#1
|
|
|
Rookie Gruppe: User Beiträge: 10 Mitglied seit: 30.05.2008 Mitglieds-Nr.: 7.404  |
Hallo zusammen!
Ich habe gerade ein paar HTML-Seiten erstellt und habe dabei feststellen müssen, dass die Links im IE6 und IE7 (wahrscheinlich auch bei noch älteren) nicht funktionieren (es ändert sich nicht einmal der Mauszeiger vom Pfeil zur Hand), während in anderen Browsern (Firefox, Safari und auch IE8) alles in Ordnung ist. Da Phase 5 als internen Browser offensichtlich auch den IE7 benutzt, obwohl auf meinem Rechner der IE8 installiert ist, tritt auch hier das Problem auf. Auf der Suche nach einer Lösung habe ich mit anderen Seiten, die ich zuvor erstellt habe, verglichen und bin dabei auf die Idee gekommen, den Eintrag für den doctype von <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> in <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> zu ändern. Und siehe da auf einmal funktionierten die Links auch im IE7 (bzw. internen Browser von Phase 5) bestens. Allerdings haben dann alle IE Versionen die Eigenschaft body {margin:0 auto; width:1000px;} nicht verstanden und den Inhalt statt mittig am linken Rand ausgerichtet. Hat hier jemand eine Idee, wie beide Fehler verhindert werden können? Ach ja: Die Seiten gibt's unter www.vanduehren.de/toeroek/ Gruß Astrid Der Beitrag wurde von taraxacum bearbeitet: 28.09.2010 - 16:12 |
 |
 
|
 |
Antworten
|
26.09.2010 - 22:40
Beitrag
#2
|
|
|
Kommt Zeit, kommt Rat, kommt Conrad!  Gruppe: Mods Beiträge: 1.169 Mitglied seit: 21.11.2001 Wohnort: Altenkirchen, Westerwald Mitglieds-Nr.: 42 |
Hallo,
hab's nur mal überflogen; sieht bei mir (Firefox und IE8) gut aus. Kann keine Überlagerungen feststellen. Nur eine andere Kleinigkeit: auf der kontakt.html ist der eMail Link problematisch. Nach .de sollte ein ? kommen bevor es mit subject weitergeht. Der Vollständigkeit halber: Leerzeichen mit %20 auffüllen! (dies aber nur am Rande...) cu Conny |
|
|
|
|
27.09.2010 - 16:04
Beitrag
#3
|
|
|
Rookie Gruppe: User Beiträge: 10 Mitglied seit: 30.05.2008 Mitglieds-Nr.: 7.404 |
ZITAT(Conny @ 26.09.2010 - 23:40)  Nur eine andere Kleinigkeit: auf der kontakt.html ist der eMail Link problematisch. Nach .de sollte ein ? kommen bevor es mit subject weitergeht. Der Vollständigkeit halber: Leerzeichen mit %20 auffüllen! (dies aber nur am Rande...) Vielen Dank für den Hinweis. Das fehlende Fragezeichen bezeichne ich mal als Schreibfehler, während mir die Sache mit den Leerzeichen nicht bewusst war. Ist jetzt aber beides korrigiert. ZITAT(Thomas @ 26.09.2010 - 18:29) Dann wäre noch eine Idee, die Hintergrundgrafik tatsächlich als Hintergrundgrafik des DIV zu definieren und das Bild rechts direkt über CSS zu positionieren (ohne das umgebende DIV, welches eigentlich unnötig ist, da man dessen CSS-Attribute auch dem IMG geben kann). Ansonsten strecke ich jetzt die Waffen. Ich vermute, dass die margins einen nicht unerheblichen Anteil am Problem haben (da schließe ich auch daraus, dass das Problem erst auftritt, nachdem du eine margin eingefügt hast). Deshalb würde ich, falls es eine meiner Seiten wäre, auf jeden Fall mit Positionierung arbeiten (die geht auch relativ, das habe ich oben etwas missverständlich formuliert). Ansonsten könnte ich das wohl nur lösen, indem ich es selbst nachbaue, und dazu fehlt mir die Zeit. Falls also obige Idee auch nicht hilft und du weiterhin margins verwenden möchtest, hat eventuell jemand anders noch einen Einfall. Das Ringbuch als background-image zu verwenden, führte zunächst dazu, dass es komplett verschwand, so dass ich diese Möglichkeit zunächst verwerfen wollte. Dann habe ich noch ein bisschen herumprobiert, vor allem auch mit position:relative, womit ich noch keine Erfahrung habe. Schließlich habe ich noch einmal neu angefangen und dabei alle CSS-Eigenschaften in die Datei hinein genommen, damit ich nichts übersehe. ... und auf einmal war das background-image sichtbar, zwar total verschoben, aber daran konnte ich ja arbeiten. So habe ich jetzt eine Version unter test.html, die fast gut ist. Hintergrundgrafik, Text und Navigation am richtigen Ort und funktioniert auch im P5 (IE7 habe ich nur auf einem anderen Rechner, auf den ich gerade keinen Zugriff habe). Das einzige Problem ist jetzt noch das Bild, das sich eigentlich rechts neben der Navigation befinden sollte. Es ist aber ganz unten auf der Seite und lässt sich von dort nicht wegbewegen. Und das unabhängig vom Browser. |
|
|
|
|
27.09.2010 - 18:39
Beitrag
#4
|
|
|
Nachschlagewerk des Orakels Gruppe: Mods Beiträge: 955 Mitglied seit: 29.08.2006 Wohnort: Frankfurt am Main Mitglieds-Nr.: 6.217 |
Dann probier doch nochmal folgendes:
CODE <style type="text/css"> div.ring { position: relative; left: 0; top: 0; } ul.nav { position:absolute; left:540px; top:40px; } div.inhalt { position:absolute; left:50px; top:40px; } img.bild { position: absolute; right: 0; top: 60px; } </style> Der HTML-Code oben enthält nur die Angaben zur Positionierung, damit klar wird, wie es funktioniert. Natürlich muss der Rest auch wieder rein. Dadurch, dass DIV.ring relativ positioniert wird (mit top und left 0), passiert erstmal nichts (er steht da, wo er normalerweise auch ohne die Anweisung stehen würde). Durch die POSITION-Angabe kannst du jetzt aber innerhalb von DIV.ring wieder "position:absolute;" verwenden, welches sich aber auf die Position von DIV.ring bezieht, prinzipiell also relativ zu verstehen ist (das wird auch bei SELFHTML erklärt (Besonders das Verhalten der Angaben absolute und relative ist anfangs etwas verwirrend. Denn absolute verhält sich durchaus relativ), ist aber am einfachsten zu verstehen, wenn man es mal ausprobiert). So kann man UL.nav, DIV.inhalt und IMG.bild recht einfach innerhalb des DIV.ring positionieren. Ich habe obigen Code im FF ausprobiert (geht mit dem Add-On Firebug recht einfach und direkt im bestehenden Quellcode), jetzt musst du nur noch testen, ob dass auch mit den anderen Browsern funktioniert. Falls ja, solltest du so eine einfache, übersichtliche und leicht zu wartende Lösung haben. |
|
|
|
Beiträge in diesem Thema
taraxacum funktionale Unterschiede zwischen Browsern 24.09.2010 - 16:08
Thomas Hallo Astrid!
Standen die Conditional Comment... 24.09.2010 - 18:50
taraxacum Hallo Thomas,
ZITAT(Thomas @ 24.09.2010 ... 25.09.2010 - 11:36 Thomas Sorry,
ich dachte, da du Conditional Comments ver... 25.09.2010 - 15:32 taraxacum sorry, ich kannte nur den Ausdruck nicht.
ZITAT(... 25.09.2010 - 17:32 Thomas ZITAT(taraxacum @ 25.09.2010 - 18:32... 26.09.2010 - 7:44 taraxacum Weder das Vertauschen von div.inhalt und ul.nav no... 26.09.2010 - 14:53 Thomas Deine Links gehen beide auf die Kontaktseite - tro... 26.09.2010 - 15:24 Thomas Noch 'ne Idee: Probier mal, den DIV und die UL... 26.09.2010 - 15:29 taraxacum ZITAT(Thomas @ 26.09.2010 - 16:29) N... 26.09.2010 - 17:12 Thomas Dann wäre noch eine Idee, die Hintergrundgrafik ta... 26.09.2010 - 17:29 Thomas Hallo Conny,ZITAT(Conny @ 26.09.2010 - 2... 26.09.2010 - 23:53 taraxacum Vielen Dank für die tolle Unterstützung.
Sorr... 28.09.2010 - 15:20 Thomas ZITAT(taraxacum @ 28.09.2010 - 16:20... 28.09.2010 - 15:31 Conny Hoi,
vom Impressum aus funktionieren alle Links... 26.09.2010 - 22:56 |
1 Besucher lesen dieses Thema (Gäste: 1 | Anonyme Besucher: 0)
0 Mitglieder:
|
Vereinfachte Darstellung | Aktuelles Datum: 28.04.2024 - 23:13 |