Merge pull request github#1259 from tusharbansal22/fixed-footer-iframe

zkoppert · web-flow · commit 6c1f82e49c98 · 2023-05-04T10:35:40.000-07:00
fixed unresponsiveness of the iframe in footer
diff --git a/_includes/footer.html b/_includes/footer.html
@@ -2,18 +2,18 @@
 <div class="bg-gray py-5">
   <footer class="container-lg text-center">
 
-    <div class="mx-auto">
-      <div class="height-full p-5">
-        <div class="bg-white border p-5 d-inline-block box-shadow rounded-2">
-          <h3 class="alt-h2 mt-3">
-            {{ t.YouTube }}
-          </h3>
-          <iframe width="560" height="315"
-            src="https://www.youtube-nocookie.com/embed/videoseries?list=PL0lo9MOBetEFmtstItnKlhJJVmMghxc0P"
-            frameborder="0" allowfullscreen>
-          </iframe>
-        </div>
+   <div class="mx-auto" >
+  <div class="height-full p-5" >
+    <div class="bg-white border p-5 d-inline-block box-shadow rounded-2" style="width:70vw; max-width:565px ">
+      <h3 class="alt-h2 mt-3">{{ t.YouTube }}</h3>
+      <div style="width: 100%; max-width: 560px; height: 0; padding-bottom: 56.25%; position: relative;">
+        <iframe src="https://www.youtube-nocookie.com/embed/videoseries?list=PL0lo9MOBetEFmtstItnKlhJJVmMghxc0P" frameborder="0" allowfullscreen style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"></iframe>
       </div>
+    </div>
+  </div>
+</div>
+
+
 
       <div class="mx-auto">
         <div class="height-full p-5">
