<iframe>をwordpressで反応させる方法。私はそれをモバイルでもデスクトップでも反応させることができます。

Question

私は以下のCSSとhtmlを使ってiframeを応答性にしていますが、私はそれをデスクトップやモバイルデバイス用に修正することしかできません。私はそれが来るようベン申し訳ありませんが、私はサイトのワードプレスを使用しています、自分自身や学習コーダのあまりないです

HTML 
<div class="schedule"><iframe src="http://pranamaya-yoga.com/calendar-2/action~month/exact_date~1477937700/cat_ids~156/request_format~json/" style=" border-width:0 " frameborder="no" scrolling="no"></iframe></div> 

CSS 
.schedule { 
    position: relative; 
    padding-bottom: 153%; 
    padding-top: 1441px; 
    height: 150%; 
    overflow: hidden; 
} 
.schedule iframe { 
    position: absolute; 
    top:-155px; 
    left: 0; 
    width: 100%; 
    height: 150%; 
} 

Answer 1

             
  
 
   
 
    
.schedule { 
 
    \t position: relative; 
 
    \t padding-bottom: 56.25%; /* 16:9 */ 
 
    \t padding-top: 25px; 
 
    \t height: 0; 
 
    } 
 
    .schedule iframe { 
 
    \t position: absolute; 
 
    \t top: 0; 
 
    \t left: 0; 
 
    \t width: 100%; 
 
    \t height: 100%; 
 
    }
 
    
<div class="schedule"> 
 
     <iframe width="560" height="349" src="http://www.youtube.com/embed/n_dZNLr2cME?rel=0&hd=1" frameborder="0" allowfullscreen></iframe> 
 
     </div>
 
   
 
  
 
 

 


.schedule iframe { 
    position: absolute; 
    top:0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
}