自適應高度div內嵌iframe高度被撐開問題解決打賞

標題有點長,就想表達一個意思,div自適應的情況下,內部嵌入iframe,iframe邊框什么的全部設置0,本以為外層div可以完美自適應,結果div在不同瀏覽器卻生生多出3-5個像素的高度。

找了下相關文章,發現確有此問題,有人說用負的margin值,可終究不完美,終極完美解決方案竟然是給iframe加display: block,或者vertical-align: bottom。

效果如圖所示:
iframe_div_1

默認情況下,設置500px高度
iframe_div_2
上級容器wrapper高度503px
iframe_div_3
而設置iframe為block后(或者vertical-align: bottom),上級容器wrapper恢復500px高度

自適應高度div內嵌iframe高度被撐開問題解決
文章《自適應高度div內嵌iframe高度被撐開問題解決》二維碼
  • 微信打賞
  • 支付寶打賞

已有1條評論

  1. 何捷浪

    不錯,受教了~好~萌菌網www.moejun.tv/

    2015-04-27 09:52 回復

(必填)

(必填)

(可選)

黑龙江22选5开奖