Hallo zusammen,

Ich tüftle gerade wieder ein wenig und hab folgende Frage:

Wie wende ich Z-Index richtig an.

Hier mal der HTML Code:

PHP-Code:

                <div id="header_r">

                        <div id="logo"><div id="mph_290">Please update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash Player</a> to view content.</div>
    <script type="text/javascript">
    var flashvars = { mpid: "mph", align: "center", showVersionInfo: "false"};
    var params = { wmode: "transparent", base: "http://localhost/"};
    var attributes = {};
    swfobject.embedSWF("http://localhost/modules/mod_mph/mph.swf?290", "mph_290", "900", "200", "9.0.0", "", flashvars, params, attributes);
    </script></div>
                        
                    </div>
                </div>
            </div>


            <div id="search">
                <div class="klammer"><img src="/images/stories/general.png" alt="Keplinger Schriftzug" align="left" /></div>
            </div> 


Ich will jetzt, das die DIV Klammer über der Div Logo angezeigt wird, also das Div Logo im Hintergrund ist und DIV Klammer im Vordergrund ist.


Mein ansatz dazu ist wie folgt:

Code css:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21

div#logo {     position: absolute;     left: 0;     top: 0;     float: left;     width: 298px;     height: 75px;     margin-left: 21px;     margin-top: 0px;     z-index:1; }   #search {     float: right;     width:320px;     margin-top: -75px;     margin-right: -20px;     height: 40px;     text-align:right;         z-index:2; }

Leider wird das nicht so gemacht, wie ichs mir gedacht hab. Es wird die Klammer hinter dem Logo platziert.

Was mach ich falsch?

Grüsse

Das hat mit dem Flash-Plugin zu tun, nicht mit z-index. Da Du swfObject verwendest, schau mal in deren Hilfe nach wie man dort den wmode-Parameter korrekt übergibt. Hab auf die Schnelle z.B. das hier gefunden: http://www.brianyerkes.com/swfobject...iv-over-flash/

Zitat von nchristoph

Wie wende ich Z-Index richtig an.

Mein ansatz dazu ist wie folgt:

Code css:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21

div#logo {     position: absolute;     left: 0;     top: 0;     float: left;     width: 298px;     height: 75px;     margin-left: 21px;     margin-top: 0px;     z-index:1; }   #search {     float: right;     width:320px;     margin-top: -75px;     margin-right: -20px;     height: 40px;     text-align:right;         z-index:2; }

Leider wird das nicht so gemacht, wie ichs mir gedacht hab. Es wird die Klammer hinter dem Logo platziert.

Was mach ich falsch?

z-index benötigt grundsätzlich eine Angabe zur Positionsart position (absolute, relative o. fixed), die im zweiten Regelblock für #search fehlt.

Zitat von threadi

Das hat mit dem Flash-Plugin zu tun, nicht mit z-index. Da Du swfObject verwendest, schau mal in deren Hilfe nach wie man dort den wmode-Parameter korrekt übergibt.

Scheint dafür in seinem JS-Code doch schon alles hergerichtet zu sein:

Code javascript:

1	var params = { wmode: "transparent", ... };

Danke spicelab,

hab jetzt dem searchdiv position:relative gegeben und jetzt funktionierts.