z-index bei Grafiken
Akadelvo
- css
Guten Abend Leute,
bin schon seit einiger Zeit am probieren, nur bisher habe ich keine Lösung gefunden.
Worum geht es:
Eine mit Div's aufgebaute Seite, oben Banner, mittig 3 Divs (Navigation,Inhalt und Infopanel) und unten noch eine Fußzeile. Das ganze ist in einem großen Div eingeschlossen, welches zentriert ist um schön mittig auf dem Bildschirm angezeigt zu werden.
Problem:
Ich versuche derzeitig mich mit der grafischen Aufbereitung der Seite. Daher wollte ich mit ein paar Verzier-Grafiken einem Rahmen dafür bauen. Dazu müsste ich aber die Grafik "über" den Banner legen, was mit dem z-index Parameter auch funktioniert. Z-index arbeitet, meines wissens nach, nur mit position:absolute, wenn ich dies mache klatscht sich der Banner und die Grafik oben links in die Ecke des Bildschirm. Wie bekomme ich den Banner, mit darübergelegter Grafik nun wieder mittig zentriert?
Über die direkte positionierung per left,top usw wollte ich das aber nicht machen, weil sich das bei Vergrößerung oder Verkleinerung des Fensters sich Banner und Grafik ja nicht mehr in der Mitte befinden?!?!
Haber versucht das wieder mit align=centre in die mitte zu bekommen, ohne Erfolg
Lösungsansatz 2:
Irgendwie muss es doch zu schaffen sein das sich der Banner wieder in das dafür vorgesehen div einbettet, oder?
bin langsam am verzwiefeln =/
mfg Akadelvo
Hi,
Z-index arbeitet, meines wissens nach, nur mit position:absolute,
Falsch. Z-Index wirkt immer dann, wenn das Element positioniert ist. Egal ob absolut, relativ oder fixiert.
cu,
Andreas
@@Akadelvo:
nuqneH
Eine mit Div's aufgebaute Seite
Divitis? Da ist mindestens ein div zu viel:
Das ganze ist in einem großen Div eingeschlossen, welches zentriert ist um schön mittig auf dem Bildschirm angezeigt zu werden.
Qapla'
Hi
Warum wird eigentlich bei dem 1. Webkrauts-Beispiel der ganze Hintergrund mit Farbe gefüllt? Und erst richtig, wenn man das html-Element nutzt? Das verstehe ich nicht.
@@Roger die Supermaus:
nuqneH
Warum wird eigentlich bei dem 1. Webkrauts-Beispiel der ganze Hintergrund mit Farbe gefüllt?
Weil es so spezifiziert ist: “For documents whose root element is an HTML "HTML" element or an XHTML "html" element that has computed values of 'transparent' for 'background-color' and 'none' for 'background-image', user agents must instead use the computed value of the background properties from that element's first HTML "BODY" element or XHTML "body" element child when painting backgrounds for the canvas, and must not paint a background for that child element.” [CSS21 §14.2]
Qapla'
Wenn z-index auch mit den anderen Positionen arbeitet, dann frage ich mich warum bei:
<img src="ornamental24_3.png" style="position:static; z-index:2; top:0em; left:0em;" >
<img src="banner.jpg" alt="banner" style="position:static; z-index:1; top:0em; left:0em;">
beide Grafiken nacheinander angezeigt werden. Also die Grafik über dem Banner, in der y-achse gesehen. Dies passiert auch bei relative.
Dann müsste da ja irgendetwas falsch sein, oder wie?
Hi,
Wenn z-index auch mit den anderen Positionen arbeitet, dann frage ich mich warum bei:
<img src="ornamental24_3.png" style="position:static; z-index:2; top:0em; left:0em;" >
<img src="banner.jpg" alt="banner" style="position:static; z-index:1; top:0em; left:0em;">
Enthielt meine Aufzählung den Wert static?
> beide Grafiken nacheinander angezeigt werden. Also die Grafik über dem Banner, in der y-achse gesehen. Dies passiert auch bei relative.
> Dann müsste da ja irgendetwas falsch sein, oder wie?
Dein Verständnis von position.
cu,
Andreas
--
[Warum nennt sich Andreas hier MudGuard?](http://MudGuard.de/)
[O o ostern ...](http://ostereier.andreas-waechter.de/)
Fachfragen per Mail sind frech, werden ignoriert. Das Forum existiert.
Grüße,
einen schönen rahmen machst du zwar mit border-img, aber was spricht dagegen banner als background-img für den rahmen zu definieren?
MFG
bleicher