• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Problem mit position: absolute;

B

burn4ever

Mitglied
Hallo,
ich habe 3 div Tags, nicht verschachtele, sprich sind alle nacheinander geschlossen:
Den letzte div Tag möchte ich mit position:absolute; gerne etwas über den vorherigen Tag legen nur leider funktioniert das nicht.
Hier mal mein Skript:
Code: 
HTML, BODY{
    height: 100%;
    width: 100%;
    background-color: #424240;
}
#distance
{
    width: 8px;
    height: 50%;
    margin-bottom: -345px;
    float: left;
}
#flashContent
{
    position:static;
    margin: 0px auto;
    height: 100%;
    width: 100%;
    max-width: 1152px;
    max-height: 690px;
    clear: left;
}
#facebook
{
    position: absolute;
    width:200px;
    height: 20px;
    margin: -28px auto 0px;
    padding: 0px 0px 0px 88px;
}
 
Skript, soso ..

Ein link oder wenigstens der passende HTML Schnipsel dazu wäre vielleicht nicht schlecht
 
Okay,
hier mal der Code meiner html:
Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de">
    <head>
<title>Portfolio</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="description" content="" />
<meta name="language" content="de" />
<meta name="keywords" content="" />
<meta name="robots" content="index,follow" />
<meta name="audience" content="alle" />
<meta name="page-topic" content="Medien, Film" />
<meta name="revisit-after" content="14 days" />
<meta name="author" content="" />
<link href="main.css" rel="stylesheet" type="text/css" />
<style type="text/css" media="screen"></style>
<script type="text/javascript" src="swfobject.js"></script>
        <script type="text/javascript">
            swfobject.registerObject("Master_Website", "9");
        </script>
                
    </head>
    <body>
<div id="distance"></div>    
<div id="flashContent">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="100%" height="100%" id="Master_Website" align="middle">
                <param name="movie" value="Master_Website_14.swf" />
                <param name="bgcolor" value="#424240" />


                <!--[if !IE]>-->
                <object type="application/x-shockwave-flash" data="Master_Website_14.swf" width="100%" height="100%">
                    <param name="movie" value="Master_Website_14.swf" />
                    <param name="bgcolor" value="#424240" />


                <!--<![endif]-->
                    <a href="http://www.adobe.com/go/getflash">
                        <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Hier gehts zum Download der Adobe Flashplayers" />
                    </a>
                <!--[if !IE]>-->
                </object>
                <!--<![endif]-->
            </object>
        </div>
           <div id="facebook"><div id="fb-root"></div><script src="http://connect.facebook.net/de_DE/all.js#xfbml=1"></script><fb:like href="www.meineurl.de" send="false" layout="button_count" width="150" show_faces="false" font=""></fb:like>
           </div>
    </body>
</html>
 
Zuletzt bearbeitet:
probiers mal mit "z-index"

Quelle: selfhtml.org

Mit z-index: können Sie die Reihenfolge von überlappenden Elementen bestimmen. Notieren Sie für jedes Element, für das Sie eine eindeutige Schichtposition festlegen wollen, eine Zahl. Je höher die Zahl, desto weiter vorne liegt das Element, je niedriger, desto weiter hinten liegt das Element vom Betrachter aus gesehen. Die Schichtposition orientiert sich darüber hinaus an der des Elternelements. Per z-index positionierte Elemente erzeugen für sich und ihre Nachfahren einen eigenen Stapel-Kontext. So werden im Beispiel die Boxen D, E und F als Nachfahren der Box C gesondert sortiert: Box F (z-index:-1) überdeckt trotz niedrigerem Wert Box B (z-index:1), da sie als Nachfahre von Box C (diese liegt mit z-index:3 über Box B) lediglich innerhalb dieser sortiert wird. Außerhalb des neuen Kontexts liegende Elemente (A und B) können nicht zwischen diesen gestapelt werden.
Zum Vergrößern anklicken....
 
Funktioniert leider auch nicht.
Ich gebe zwar dem div, welches vorne liegen soll, den größeren z-index Wert aber die swf bzw. (div id"flashcontent") bleibt drüber liegen :?

Hat es evtl. was mit dem Code vom Facebookbutton selber zu tun?
 
Okay,
wenn ich dem div ein:
position:fixed; gebe funktioniert das aber das will ich ja nicht...hm hm hm
 
Zuletzt bearbeitet:
burn4ever schrieb:
Ich gebe zwar dem div, welches vorne liegen soll, den größeren z-index Wert
Zum Vergrößern anklicken....

Du musst beiden Elementen einen "position"-Wert ungleich "static" geben. z-index wirkt nur auf Elemente mit "position: relative;" oder "position: absolute;".

aber die swf bzw. (div id"flashcontent") bleibt drüber liegen
Zum Vergrößern anklicken....

Aber gut, dass Du noch erwähnt, dass es um Flash geht. Das Flash-Plugin drängelt sich unabhängig von diesen CSS-Eigenschaften gerne in den Vordergrund. Das kann man nur mit einem zusätzlichen Flash-Parameter umgehen. Schau dich mal auf der Adobe-Webseite nach "wmode" um.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben