Seite 1 von 1

[erledigt] HTML/CSS-Problem mit position:absolute im Firefox

Verfasst: 03.08.2009, 16:52
von MarTenG
Da hier ja doch einige unterwegs sind, die Erfahrung im Erstellen von Webseiten haben, erläutere ich hier einfach mal mein Problemchen.

Ich habe mehrere Bilder mittels position:absolute am linken Bildschirmrand positioniert.
Als Beispiel

Code: Alles auswählen

HTML
<a href="/b1.html" target="ifr"><img src="/../bilder/bluete1.gif" id="b1" border="0" alt="Bl&uuml;te" title="Die Waldelfe"></a>

CSS
img#b1 {position:absolute; top:13px; left:21px;}
Lokal funktioniert das auch wunderbar. Nur wenn ich es hochlade verschiebt Firefox die Bilder nach unten. Im Internet Explorer geht es, da habe ich bisher allerdings nur den 8er getestet.

Im Moment weiß ich nicht wo ich noch nach meinem Fehler schauen soll :| In der Regel, wenn es im Internet nicht mehr so aussieht wie lokal, liegt es bei mir an fehlerhaften Pfaden, hier stimmen die jedoch (der Rest aus der CSS-Datei wird ja auch berücksichtigt).

Bild

Re: HTML/CSS-Problem mit position:absolute im Firefox

Verfasst: 03.08.2009, 17:33
von Beowulf
Nun ja, was mich stört, ist das recht spezifische img#b1. Derartige Formatierungen gibt es erst mit CSS2, was unter Umständen nicht jeder Browser versteht. Auch finde ich eine derartige Schreibweise unnötig, weil eine Id in der kanzen Datei nur einmal vorkommen darf. #b1 müsste ausreichen.

Re: HTML/CSS-Problem mit position:absolute im Firefox

Verfasst: 03.08.2009, 17:34
von sinus
Hm, vielleicht solltest du bei absoluter Positionierung lieber ein DIV als Container verwenden und diesem dann die Positionierungseigenschaften zuweisen als dies mit Inline-Elementen zu tun.

Was mir noch aufgefallen ist ...

- IMG nach XML nicht ordentlich abgeschlossen (<img/>)
- versuch mal, die ID im StyleSheet einfach nur als #b1 anzugeben, macht das ganze weniger kompliziert (mehr Browser könnens interpretieren)

Das Phänomen der Online/Offline-Unterschiede kann ich mir auch nicht erklären. Eventuell mal Strg+F5 probieren.

Hab mir noch mal das Bild angeschaut - so recht begreife ich das nicht. Du meinst, das Bild sei nach verschoben. Sind das mehrere Blumenbilder übereinander?

Re: HTML/CSS-Problem mit position:absolute im Firefox

Verfasst: 03.08.2009, 17:44
von MarTenG
Der Server ist online.
Mit dem img#b1 stimmt natürlich, da habe ich mir einen Bärendienst erwiesen. Immerhin hab ich mich bewußt für id entschieden, weil es eh nicht nötig ist die Eigenschaften auf mehrere Elemente zu verwenden und mir so zwei Buchstaben spare...

Die Ranken sind ein Hintergrundbild. Jede Blüte ist dann ein individuell positioniertes Bild.

Re: HTML/CSS-Problem mit position:absolute im Firefox

Verfasst: 03.08.2009, 17:45
von sinus
jetzt verstehe ich ... habs auch grad gemerkt.

Re: HTML/CSS-Problem mit position:absolute im Firefox

Verfasst: 03.08.2009, 18:04
von MarTenG
Der Tipp mit dem div-container war gut :D
Habe die oberste Blüte testweise mit div-tag eingeschlossen und diesen die id zugewiesen, jetzt funktioniert es. Warum es offline auch so ging, online aber nicht, ist mir zwar immernoch schleierhaft, na ja....

Vielen Dank

Re: HTML/CSS-Problem mit position:absolute im Firefox

Verfasst: 03.08.2009, 18:12
von sinus
MarTenG hat geschrieben:Warum es offline auch so ging, online aber nicht, ist mir zwar immernoch schleierhaft, na ja....
Mysteries of Webdesign - demnächst bei Galileo



;)