如何在Internet Explorer中的全高度表中创建全高度单元格 [英] how to make full height cell in full height table in Internet Explorer
问题描述
我有下一个html代码
I have next html code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<style type="text/css">
html {height:100%;}body {height:100%;margin:0;}
h1 {form-size:20px;margin:0;padding:20px;}
</style>
</head>
<body>
<table style="width:100%;height:100%">
<tr>
<td>
<div style="background-color:#f00;">
<h1>This text should make height of this cell</h1>
</div>
</td>
</tr>
<tr style="height:100%;" id="row">
<td style="background-color:#c0c;">
<div style="height:100%;width:100%;background-color:#00f;color:#fff;">
This cell should take all unused space of table
</div>
</td>
</tr>
<tr>
<td>
<div style="background-color:#0f0;">
<h1>This text should make height of<br> this cell</h1>
</div>
</td>
</tr>
</table>
</body>
</html>
它适用于所有浏览器 - 除了IE，其中蓝色div中间单元格只占空间的文本。
可能有人知道如何将它拉伸到表内的整个可用空间？
It works perfect in all browsers - except IE, where blue div inside middle cell takes space only for text. May be someone know how to stretch it to whole free space inside table?
更新：我知道表在页面布局方面不好。如果你可以显示我的示例div布局，有顶部和底部块与可变高度和中间部分，使用浏览器窗口的所有可用空间，我会使用它。 I promise =）
UPDATE: I Know that tables are bad in page-layout. if you can show me example of div layout which have top and bottom block with variable height and middle part which use all free space of browser window I will use it. I promise =)
推荐答案
不要使用表格布局，
使用Divs和CSS，使用表格被视为不当做法：
Use Divs and CSS, It is considered a bad practice to use tables:
http：// shouldiusetablesforlayout .com
http：// www.hotdesign.com/seybold/
http://webdesign.about.com/od/layout/a/aa111102a.htm
http://www.htmlgoodies.com/beyond /css/article.php/3642151/CSS-Layouts-Without-Tables.htm
Live Demo converted to DIV's
这篇关于如何在Internet Explorer中的全高度表中创建全高度单元格的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
