Youtube responsiv mit videoSplash einbinden

[operatorone]

Hi, wenn ich das CSS was ich bisher für die responsive Darstellung des Youtube-Players genutzt habe einsetze, dann habe ich durch das padding-bottom des umgebenden Containers einen großen Abstand unter dem Splash image. Sobald ich auf das Bild klicke wird dieses gegen den iframe getauscht und der Abstand verschwindet. Wie könnte ich dies beheben? Kann ich ein DIV nur um den iframe legen, so dass das padding-bottom nur dort Wirkung zeigt?

Viele Grüße, operatorone

.ce_youtube {
    position: relative;
    padding-bottom: 56.25%;
    width: 100%;
    height: auto;
}

.ce_youtube iframe {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100% !important;
  height: 100% !important;
}

[fritzmg]

z.B.:

    .ce_youtube {
        position: relative;
        padding-bottom: 56.25%;
        width: 100%;
        height: auto;
    }

-   .ce_youtube iframe {
+   .ce_youtube > * {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100% !important;
        height: 100% !important;
    }

[operatorone]

Ja, SUPERGEIL!!! Vielen Dank für deine Hilfe.