Здравствуйте, есть проблема с растягиванием элемента по высоте на 100% от родительского. Тема изъезженная, но никак не могу найти оптималього сопосба решения: Код: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html style="height: 100%;"> <head> <title>Untitled</title> </head> <body style="height: 100%;"> <table cellpadding="0" cellspacing="0" border="1" style="background-color: blue; height: 100%; width: 100%;"> <tr> <td style="height: 100%; width: 50%;"> <table cellpadding="0" cellspacing="0" style="background-color: yellow; height: 100%;"> <tr> <td style="height: 100%;">asss</td> </tr> </table> </td> <td> <div style="background-color: green; height: 2000px;"> some dynamic content here </div> </td> </tr> </table> </body> </html> В зеленом блоке некий контент произвольный, сейчас например на 2000 пикселей. Во всех нормальных браузерах желтый блок в левой ячейке будет занимать все свободное пространство по вертикали. Однако в IE (например 9.0) желтый блок занимает высоту равную высоте экрана, каким образом это можной обходить? у меня из способов обхода нашлось только в такм стиле решение костылем ява-скриптом с добавлением класса height100 к желтому блоку: jQuery.fn.height100 = function(px) { jQuery(this).each(function(){ jQuery(this).css('height','auto'); jQuery(this).css('height',jQuery(this).parent().height()); }); return this; }; jQuery(document).ready(function(){ setTimeout(function(){ jQuery('.height100').height100(); }, 1000); }) Как можно "по-человечески" это обходить?