IPB

Willkommen, Gast ( Anmelden | Registrierung )

2 Seiten V  < 1 2  
Reply to this topicStart new topic
> funktionale Unterschiede zwischen Browsern
Thomas
Beitrag 26.09.2010 - 17:29
Beitrag #11


Nachschlagewerk des Orakels
Gruppensymbol

Gruppe: Mods
Beiträge: 955
Mitglied seit: 29.08.2006
Wohnort: Frankfurt am Main
Mitglieds-Nr.: 6.217



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.
Go to the top of the page
 
+Quote Post
Conny
Beitrag 26.09.2010 - 22:40
Beitrag #12


Kommt Zeit, kommt Rat, kommt Conrad!
Gruppensymbol

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
Go to the top of the page
 
+Quote Post
Conny
Beitrag 26.09.2010 - 22:56
Beitrag #13


Kommt Zeit, kommt Rat, kommt Conrad!
Gruppensymbol

Gruppe: Mods
Beiträge: 1.169
Mitglied seit: 21.11.2001
Wohnort: Altenkirchen, Westerwald
Mitglieds-Nr.: 42



Hoi,
vom Impressum aus funktionieren alle Links!
Lediglich die eMail funktioniert nicht, ist auch nicht als Link definiert, sondern als Absatz <P>.

cu
Conny
Go to the top of the page
 
+Quote Post
Thomas
Beitrag 26.09.2010 - 23:53
Beitrag #14


Nachschlagewerk des Orakels
Gruppensymbol

Gruppe: Mods
Beiträge: 955
Mitglied seit: 29.08.2006
Wohnort: Frankfurt am Main
Mitglieds-Nr.: 6.217



Hallo Conny,
ZITAT(Conny @ 26.09.2010 - 23:40) *
hab's nur mal überflogen; sieht bei mir (Firefox und IE8) gut aus.
Kann keine Überlagerungen feststellen.
das deckt sich mit der Erfahrung der TE wink.gif
ZITAT(taraxacum @ 24.09.2010 - 17:08) *
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.

Das Problem liegt bei älteren IE-Versionen, die irgendetwas über die Links legen.
Go to the top of the page
 
+Quote Post
taraxacum
Beitrag 27.09.2010 - 16:04
Beitrag #15


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.
Go to the top of the page
 
+Quote Post
Thomas
Beitrag 27.09.2010 - 18:39
Beitrag #16


Nachschlagewerk des Orakels
Gruppensymbol

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.
Go to the top of the page
 
+Quote Post
taraxacum
Beitrag 28.09.2010 - 15:20
Beitrag #17


Rookie


Gruppe: User
Beiträge: 10
Mitglied seit: 30.05.2008
Mitglieds-Nr.: 7.404



Vielen Dank für die tolle Unterstützung.

Sorry, dass ich es versäumt habe, intensiver über die Positionierung zu lesen. Aber mit Hilfe Deiner Angaben, die ich nur ein wenig angepasst habe (vor allem darf div.ring kein left:0 haben, weil sonst die Zentrierung nicht mehr funktioniert), habe ich jetzt eine Seite, die mit FF, IE8, Safari und P5 (ich hoffe, dann auch mit IE7) funktioniert.

Ich musste dem Ordner jetzt leider einen Passwortschutz verpassen, weil meine Auftraggeberin wohl entsetzt darüber war, dass die Seiten in Suchmaschinen zu finden sind, obwohl sich die Seiten noch in der Testphase befinden und daher kein Link auf diese Seiten verweist (das habe ich bisher für unmöglich gehalten). Tut mir Leid, wenn die Seiten nun nicht mehr für das Forum zugänglich sind, aber eine andere Lösung fällt mir jetzt nicht ein.

Ein Frage noch von einer unerfahrenen Forumsteilnehmerin: was heißt TE ausgeschrieben?

Nochmal vielen Dank für die Hilfe. Ich habe eine Menge gelernt.
Go to the top of the page
 
+Quote Post
Thomas
Beitrag 28.09.2010 - 15:31
Beitrag #18


Nachschlagewerk des Orakels
Gruppensymbol

Gruppe: Mods
Beiträge: 955
Mitglied seit: 29.08.2006
Wohnort: Frankfurt am Main
Mitglieds-Nr.: 6.217



ZITAT(taraxacum @ 28.09.2010 - 16:20) *
Vielen Dank für die tolle Unterstützung.
Da nich für wink.gif.

ZITAT(taraxacum @ 28.09.2010 - 16:20) *
Ich musste dem Ordner jetzt leider einen Passwortschutz verpassen, weil meine Auftraggeberin wohl entsetzt darüber war, dass die Seiten in Suchmaschinen zu finden sind, obwohl sich die Seiten noch in der Testphase befinden und daher kein Link auf diese Seiten verweist (das habe ich bisher für unmöglich gehalten).
Naja, hier im Forum gibt/gab es einen Link, der reicht eventuell schon.

ZITAT(taraxacum @ 28.09.2010 - 16:20) *
Ein Frage noch von einer unerfahrenen Forumsteilnehmerin: was heißt TE ausgeschrieben?
Thread-Eröffner/-in.

Ich würde bei dem Bild oben rechts noch überlegen, ob es wirklich als animiertes Gif (Bilderfolge) erscheinen soll (und dadurch recht pixelig wirkt). Vielleicht besser ein einzelnes Bild als Jpeg oder doch eine Umwandlung in Gif, die etwas weniger pixelig ist. Wie auch immer: Viel Erfolg bei der Umsetzung. Schön, dass wir helfen konnten und danke für deine Rückmeldung.
Go to the top of the page
 
+Quote Post
Google Bot
Beitrag
Beitrag #


Google Ads









Go to the top of the page
 
Quote Post

2 Seiten V  < 1 2
Reply to this topicStart new topic
1 Besucher lesen dieses Thema (Gäste: 1 | Anonyme Besucher: 0)
0 Mitglieder:

 



RSS Vereinfachte Darstellung Aktuelles Datum: 28.03.2024 - 15:16

taschenkalender
expertise-panel IPS Driver Error

IPS Driver Error

There appears to be an error with the database.
You can try to refresh the page by clicking here