Тема: HTA,HTML5: Растягиваемый middle, фиксированные top и bottom
Очень многие из моих HTA-окон состоят из таблицы с фиксированной высотой верхней и нижней ячейки.
В среднюю ячейку генерируется произвольная таблица с прокруткой.
Все было хорошо до того как мне захотелось попользовать прелести HTML5 и CSS3. Попробовал. Оказалось что mshta, хотя и не все, но достаточно много из новых фич поддерживает.
Но мой классический дизайн держать не хочет ни в какую. Никакое html,body {height:100%;} не помогает. Как я ни вымудрялся, даже DIV-ами пытался заменить таблицу, фиксированные размеры не соблюдаются, внутренняя таблица вылезает за прокрутку, при изменении размеров окна все едет и расползается.
<html>
<head>
<meta http-equiv="content-type" content="text-html; charset=utf-8">
<hta:application
scroll="no"
/>
<style type="text/css">
body { margin:0px; }
</style>
<script type="text/javascript">
window.resizeTo(400, 600);
function fillTable(){
for (var i = 0; i < 50; i++) {
var r = Info.insertRow();
r.insertCell().innerText = 'name' + i;
r.insertCell().innerText = 'value ' + i;
}
}
</script>
<title>html</title>
</head>
<body onload="fillTable()">
<table style="height:100%; width:100%">
<tr>
<td style="height:80px; border:1px dotted blue;">
Верхняя панель фиксированной высоты
</td>
</tr>
<tr>
<td>
<!--Таблица с вертикальной прокруткой-->
<div style="height:100%; width:100%; overflow-y:scroll; overflow-x:hidden; border:1px dotted red;">
<table id="Info" style="width:100%;" border="1"></table>
</div>
</td>
</tr>
<tr>
<td style="height:40px; border:1px dotted blue;">
Нижняя панель фиксированной высоты
</td>
</tr>
</table>
</body>
</html>Вот так - все работает идеально. Добавляем <!DOCTYPE html> и все становится вкривь и вкось.
Так есть способ победить HTML5 или нет? (Повторюсь - ни слова о кроссбраузерности - ТОЛЬКО HTA).
