6

iframeテーブルセル内に配置したときに高さに問題があります。FirefoxとChromeは最小の高さをに設定し150px、InternetExplorerはそれより低い高さを処理します。セルの高さが以上の場合は150px、iframeうまく追従します。

興味深いのは、divその高さの範囲内に配置された場合、divの高さがより低くても150px、テーブル内のセルの高さは独自のルール（ブラウザによって設定された）に従っているように見えることです。

これがJSFiddleです

テストの例iframeは次のとおりです。

  1. iframe高さdivが150px未満の
  2. iframe高さが150px未満のテーブルセル内
  3. iframediv150px以上の高さで
  4. iframe高さが150pxを超えるテーブルセル内

追加の制限

iframe中に配置するとうまくいくように見えるので、それは良い解決策かもしれませんが、HTMLはテーブルセル内にdivレンダリングされるサードパーティのコントロールの一部であるため、HTMLを制御できません。iframeもちろん、Javascriptの操作は常にオプションですが、CSSのみを使用してこれを解決したいと思います。また、コンテナの高さは第三者によって管理されているため、iframe高さを固定高に変更することはできません。

4

2 に答える 2

1

テーブルセル内のiframeのこの150pxの制限は、Gecko/Webkitブラウザエンジンのバグとして報告されています。

https://bugzilla.mozilla.org/show_bug.cgi?id=253363

https://bugzilla.mozilla.org/show_bug.cgi?id=324388

また、Telerik RADコントロール開発チームによっても注目されています（ここを参照）。150pxが必須の最小値であると決定された理由についての明確な理由は見つかりませんでしたが、それはあなたが見た動作を説明しています。

于 2012-12-19T17:59:06.187 に答える
0

テーブルとその子をに設定してみてくださいdisplay: block。

http://jsfiddle.net/willemvb/aM2Fx/

table,
tbody,
tr,
td{
    position: relative;
    display: block;
    width: 100%;
    height: 100%;   
}

または、テーブル上で相対位置を使用し、iframe上で絶対位置を使用することもできます。

http://jsfiddle.net/eeZHZ/

table
{
    width: 100%;
    height: 100%;
    position: relative;
}


table iframe {
    position: absolute;
    top: 0;
}
于 2012-10-18T15:21:52.957 に答える