nicht angemeldet
Layer oberhalb von Grafik positionieren
Hallo,
ich versuche gerade verzwiefelt einen Layer oberhalb einer Grafik zu positionieren (da sich die Position der Grafik von Seite zu Seite ändert muss scheidet eine absolute Positionierung für mich aus). Also habe ich folgendes gemacht. Direkt hinter die Grafik habe ich diesen Layercode gesetzt:
<div id="layer" style="position:relative; width:118px; height:150px; z-index:1; top:-162; left:300;"></div>
Das funktioniert soweit auch gut das der Layer an genau der ÜPosition ist wo er hin soll. Allerdings ist nun hinter der Grafik (und die Zeilen danach) der Platz, den der Layer einnehmen würde wenn ich seine Position mit top/left nicht geändert hätte immer noch da. Ich habe also einen Layer an der richtigen Stelle und einen freien Platz von 118x150px da wo der Layercode eingebaut ist. Wie kann ich den Layer richtig einbauen so das er diesen Leerplatz nicht erzeugt?
Grüsse
Marc
-
hi,
du könntest grafik und div in einen weiteren, beide umgebenden div packen, und dann den inneren div absolut in bezug auf den umgebenden positioneren.
gruss,
wahsaga-
hiho,
wie mache ich das einen <div> absolut in bezug auf den anderen zu postieren? Ich habe im Moment diesen code:
<div align="left"><img src="bild.jpg"><div id="layer" style="position:absolute; width:118px; height:141px; z-index:2; top:0; left:0; background-color: #FF0000;"></div>
</div>Das bewirkt aber wieder, das der Layer absolut zur gesamten Seite ist, also ganz oben links in der Ecke des Browserfensters hängt...
Grüsse
Marc
-
hi,
wie mache ich das einen <div> absolut in bezug auf den anderen zu postieren? Ich habe im Moment diesen code: [...]
Das bewirkt aber wieder, das der Layer absolut zur gesamten Seite ist, also ganz oben links in der Ecke des Browserfensters hängt...lese dir http://selfhtml.teamone.de/css/eigenschaften/positionierung.htm#position nochmal aufmerksam durch.
besonders wichtig ist in diesem zusammenhang folgender abschnitt:
"Besonders das Verhalten der Angaben absolute und relative ist anfangs etwas verwirrend. Denn absolute verhält sich durchaus relativ, wie die inneren div-Elemente im obigen Beispiel zeigen: relativ nämlich zum Rand des Elternelements. Wenn sonst kein Elternelement existiert, ist das body-Element das Elternelement."gruss,
wahsaga-
hiho,
das hilft mir leider nicht viel. Denn wenn ich den inneren Layer nicht auf position:absolute setzte dann habe ich (zumindest in diesem Drecksbrowser der immer meint er wisse alles besser als der Autor namens IE) wieder das selbe Problem, nämlich das Platz reserviert wird wo eigentlich gar kein Element mehr ist... Das ist der jetzige Code den ich verwende:
<div id="box3" style="position:relative;height:29"><img src="header/header_standart.jpg" width="342" height="29" alt="Star Trek Archiv" BORDER="0"><div id="box4" style="position:relative; width:118px; height:141px; top:-153; left:300; background:#FF0000; layer-background-color: #FF0000; border: 1px none #000000;">box4</div></div>
Und so sieht das ganze aus:
http://www.startrek-bilder.de/sta/?showsummer=1
Wie dem geneigten Betrachter sicherlich auffällt sieht es im IE nicht gerade vorteilhaft aus. Und ich habe auch keine Ahnung wie ich das korrigieren soll? Irgendwelche Ideen?Grüsse
Marc
-
hi,
Und so sieht das ganze aus:
http://www.startrek-bilder.de/sta/?showsummer=1
Wie dem geneigten Betrachter sicherlich auffällt sieht es im IE nicht gerade vorteilhaft aus. Und ich habe auch keine Ahnung wie ich das korrigieren soll? Irgendwelche Ideen?ich hab zwar immer noch nicht ganz verstanden, wie das ganze jetzt genau aussehen soll - aber gib doch dem div mit der id="box4" doch jetzt bitte mal position:absolute; anstelle von relative. (dann evtl. noch die werte für top und left etwas anpassen, wenn nötig.)
gruss,
wahsaga-
hiho,
danke jetzt klappt es endlich. Uff, was ein theater :) Danke für deine Hilfe
Marc
-
-
-
-
-