Странное поведение высоты iframe при размещении в ячейке таблицы

у меня проблема с iframe высота при размещении в ячейке таблицы. Firefox и Chrome установили минимальную высоту на 150px в то время как Internet Explorer обрабатывает более низкую высоту. Когда высота ячейки больше 150px, iframe следует красиво.

интересно то, что при размещении в div его высота правильная независимо от divвысота меньше, чем 150px но внутри высоты ячейки таблицы, похоже, следует своим собственным правилам (заданным броузер.)

вот JSFiddle

пример

6
css css-tables google-chrome height iframe

2 ответов

вы можете попытаться установить стол и его детей в 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;
}
0

Это ограничение 150px для iframe в ячейке таблицы было сообщено как ошибка в движке браузера Gecko / Webkit:

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

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

Это также было отмечено командой разработчиков Telerik RAD controls (см. здесь). Я не нашел окончательной причины, почему было решено, что 150px является обязательным минимум, но это объясняет поведение вы видите.

1