iframe寬度不適合在移動的縱向方向

我在我的網站上使用iframe的下面的代碼。iframe寬度不適合在移動的縱向方向

.callrates { 
 
    position: relative; 
 
    padding-bottom: 56.25%; 
 
    padding-top: 35px; 
 
    height: 0; 
 
    overflow: scroll !important; 
 
    -webkit-overflow-scrolling:touch !important; 
 
    height:500px; 
 
} 
 

 
.callrates iframe { 
 
    position: relative; 
 
    top:0; 
 
    left: 0; 
 
    width: 100%; 
 
    height: 100%; 
 
}

<div class="callrates"> 
 
    <iframe src="https://www.xyz.php" width="200px" height="0" allowfullscreen=" " frameborder="0" scroll="no"></iframe> 
 
</div>

問題是，當我觀看從在縱向方向的移動設備iframe的寬度比屏幕尺寸更因此使得水平方向以及垂直它滾動。我希望全寬適合在屏幕上。我該怎麼做呢？

來源

2016-11-22 user249165

的** **的iframe有*寬*屬性，它是200像素和其優先級比你的CSS高**寬度：100％**。 – Anson

即使我將該寬度屬性更改爲任何值，它也不會更改任何內容。問題依然存在。我試圖保持寬度屬性爲空，甚至「0」，但沒有幫助。 – user249165

結帳這個codepen：http://codepen.io/anon/pen/YpZgYm

<iframe src="https://www.xyz.php" width="" height="0" allowfullscreen=" " frameborder="0" scroll="no">

更新：

可能不是最完美的解決方案，但如果做的iframe源頁面響應可以縮小iframe的內容是不是一種選擇。

嘗試增加

iframe{ 
     -ms-zoom: 0.75; 
     -moz-transform: scale(0.75); 
     -moz-transform-origin: 0 0; 
     -o-transform: scale(0.75); 
     -o-transform-origin: 0 0; 
     -webkit-transform: scale(0.75); 
     -webkit-transform-origin: 0 0; 
}

來源

2016-11-22 08:49:19

不會改變任何東西。它仍然是一樣的。 – user249165

因爲你設置了溢出，所以會有一個滾動條：scroll！important;但寬度會自動調整 –

有一個滾動條。但我的問題是我想全寬iframe適合在屏幕上有一個滾動條的寬度。我希望你明白我的觀點。 – user249165

iframe寬度不適合在移動的縱向方向

回答

相關問題