Iframe full screen Website

admin admin Aug 22, 2020 1951 1

Iframe full screen Website

Iframe full-screen Website

Your iframe Website width and height auto full-screen page view

 

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.      <title>Iframe full screen Website Demo</title>
  5. <style>
  6.     *{
  7.         margin:0;
  8.         padding:0;
  9.     }
  10.     html, 
  11.     body {
  12.        height:100%;
  13.        width:100%;
  14.        overflow:hidden;
  15.     }
  16.     iframe {
  17.         float:left;
  18.         height:100%; 
  19.         /* All display width 100% */
  20.         width:100%;
  21.         /* top to -18 px */
  22.         margin-top: -18px;
  23.     }
  24.     .header {
  25.         border-bottom:1px solid #000
  26.     }
  27.     .content {
  28.         height:100%;
  29.     }
  30.     .top-h {
  31.         width: 100%;
  32.         background: red;
  33.         margin-bottom: 30px;
  34.         border-bottom: 2px solid;
  35.         padding: 10px
  36.     }
  37.     .text-st {
  38.         color: white;
  39.         text-align: center;
  40.     }
  41. </style>
  42. </head>
  43. <body>
  44.     <div class="top-h">
  45.         <div class="text-st" >
  46.             <h1>Iframe full screen Website Demo</h1>
  47.             <h2>Your iframe Website width and height auto full screen page view - https://onlylearn24.com/</h2>
  48.         </div>
  49.     </div>
  50.     <iframe frameborder="0" src="https://onlylearn24.com/"></iframe>
  51. </body>
  52. </html>

 

Thank You................................

Tags: