Video auf anderer Ebene?! HTML5

  • Hallo ihr schlauen Köüfe da draußen
    Ich hänge fest beim schreiben einer Website für einen Kumpel


    Und zwar möchte ich auf der Website gleich unter dem Header ein video einbinden und abspielen lassen. Soweit so gut hat dies geklappt, jedoch hätte ich es gerne so, dass die "überhängenden" Grafiken aus dem Header über das Video "fallen".
    http://saito.finkeegaming.net/ <- Dort das Problem Visuell online


    D.h. ich bräuchte einen CSS oder gar HTML Code der es mir erlaubt das video quasi eine ebene nach unten zu verschieben sodass ich eine grafik darüber legen könnte.
    Auf der Website aktuell zu sehen ist, dass beim Schriftzug "HUÄN" der untere Teil der Grafik fehlt da das Video darüber liegt.
    Aktuell liegt die Grafik unter dem Header im Hintergrund damit mir das video/die grafik nicht die Seite zerreißt.
    Wie bekomme ich das Quasi gedreht? Dass das Video im Table hintergrund liegt und die Grafik darüber?


    Meine Video einbindung in die Table:

    HTML
    1. <td colspan="2" background="Bilder/huan_16.png" width="460" height="233" alt="">
    2. <div class="background-wrap">
    3. <div id="player-overlay">
    4. <center>
    5. <video preload="auto" autoplay loop muted="muted" width="455" height="227">
    6. <source src="http://saito.finkeegaming.net/video/video_web_converted.mp4" type="video/mp4">
    7. Video not Supported
    8. </video>
    9. </center>
    10. </div></td>


    Die zuweisung im CSS:


    Was mache ich falsch? Hoffe ihr könnt mir Helfen :thumbsup:

  • Wenn ich dich richtig verstehe, kannst Du das erreichen, indem Du das Video exklusiv in eine neue Reihe der Tabelle legst, hinter den beiden Grafiken.
    Benutzung von Tabellen für Layoutzwecke ist nicht mehr zeitgemäß. In deinem Beispiel macht es das Layout IMO unnötig kompliziert - ohne Tabelle wäre es einfacher.

  • Wenn ich dich richtig verstehe, kannst Du das erreichen, indem Du das Video exklusiv in eine neue Reihe der Tabelle legst, hinter den beiden Grafiken.
    Benutzung von Tabellen für Layoutzwecke ist nicht mehr zeitgemäß. In deinem Beispiel macht es das Layout IMO unnötig kompliziert - ohne Tabelle wäre es einfacher.

    Habe das Problem gelöst :)
    dennoch danke :)


    Der fehler lag darin dass ich erst dem gesammten <Body> via <Div class "content"> und CSS einen z-index von 2 gegeben habe und innerhalb des Bodys dort wo das Video platziert werden sollte eine neue <Div class" background-wrap"> CSS z-index 1 geschrieben habe ohne den <body> <Div class "content"> zu beenden und den Teil vom Video via <Div class "background-wrap"> zu beenden um dann den <Body><div class "content"> mit CSS z-index 2 wieder neu aufzunehmen.


    Somit hat der erste <Div class "content"> den <Div class "background-wrap"> einfach ignoriert