html - IE 7 问题 : Super simple page - TD height not taking effect-6ren

html - IE 7 问题 : Super simple page - TD height not taking effect

转载作者：太空宇宙更新时间：2023-11-04 16:00:45

25

4

这是我的标记:

<!DOCTYPE HTML>
<html>
   <head>
      <title>Test title</title>
      <style type="text/css">
         *
         {
            margin:0px auto;
            padding:0px;
         }
         html,body
         {
            height:100%;
            width:100%;
         }
      </style>
   </head>
   <body>
      <table cellspacing="0" cellpadding="0" style="width: 100%; height: 100%;">
         <tr>
            <td style="height:55px;background:#CCC;" valign="top">
               <h1>Header</h1>
            </td>
         </tr>
         <tr>
            <td valign="top">
               Content @RenderBody()
            </td>
         </tr>
         <tr>
            <td style="height:85px;background:#CCC;" valign="bottom">
               Footer
            </td>
         </tr>
      </table>
   </body>
</html>

谁能告诉我为什么 td height 没有生效？同样的标记适用于 IE9。是因为 HTML5 文档类型吗？

最佳答案

首先，您绝对应该重新考虑您的页面布局方法。表格应该只用于呈现表格数据而不是设置页面布局。如果可能，您应该查看层叠样式表 (CSS) 和布局元素，例如 DIV。

然而，在解决这个问题时，高度样式似乎适用于 Chrome，并且根据此处的信息有效:http://www.w3schools.com/css/css_table.asp .

按照上面的建议，尝试通过位于 http://validator.w3.org/ 的 W3C 验证器运行您的代码.

我仍然建议尽可能放弃使用表格，并使用外部 CSS 而不是内联样式来设置元素的样式，因为这是一种更现代、更灵活且语义正确的方法。您可能正在学习一些过时的教程。

希望对您有所帮助。

关于html - IE 7 问题 : Super simple page - TD height not taking effect，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/9834526/

25

4

0

文章推荐： c++ - std::map 中的 std::pair 作为 const 返回

文章推荐： javascript - object.prototype 破坏 javascript

文章推荐： c++ - "macro names must be identifiers"

html - css height, max-height, line-height VS.垂直对齐
这个问题在这里已经有了答案: How can I vertically align elements in a div? (28 个答案) Vertical Aligned Text and Im
iOS - AutoLayout 可以像 view0.height = view1.height + view2.height 这样的约束吗？
我想做一个像 view0.height = view1.height + view2.height 这样的约束。当 view1.height 或 view2.height 改变时，view0.heig
html - float div 中的图像 : minimum height = font-height/line-height?
有人可以解释为什么这个标记: 呈现大约 2x18 的 float div(在 Chrome/Firefox 中)而不是 2x2 div？即使所有空格都被删除，图像似乎也遵循 font-
html - 我如何在 CSS 中执行 "min-height: height of content; height: relative to viewport;"？
我的 HTML 页面上有一些可拉伸(stretch)的元素。使用这个 CSS .stretchable-element { height: 25%; } 随着浏览器窗口高度的增加，可伸缩元素
android - calculateInSampleSize，为什么 Math.round 在 width > height 时处理 height(height/reqHeight)？
我在“developer.android.com”上查看以缩小我的位图文件，但我发现了一件事我不明白。所以我很感激你能给我一点帮助。这是一个 snippet来自 developer.android.
html - 为什么高度为: 100% on a child element not apply when the parent element has a min-height/max-height value but no height value?
假设我们有以下设置: .container { background-color: red; width: 500px; min-height: 300px; } .child { b
jquery - $(window).height() 与 $(document).height
我遇到了高度错误的问题 $(window).height(); 也有类似的问题 here 就我而言，当我尝试时 $(document).height(); 它似乎返回了正确的结果窗口高度返回320
JavaFX : Adapt component height to its children height?
我正在尝试使用 javaFX (2.2) 开发桌面应用程序，但我遇到了一些困难，无法真正让它按照我希望的方式运行。作为该框架的新用户，我可能没有按应有的方式使用它... 我想要的是一种仪表板，在 Sc
jquery - 使 Container.height = Right_Column.height
就这么简单:) 我右边的列动态变化，由于左列的高度设置为 100%，我认为根据 Right_Column 的高度动态修改容器的高度会很好。有小费吗？谢谢:) 最佳答案如果我正确理解了问题，你可以做这
macos - 界面生成器 : Height = half the height of the container
我有一个 ScrollView(包含 NSTextEditor)，其顶部、左侧和右侧约束相对于其容器(主窗口)正确设置为 0。我无法使其高度为主容器的一半。有什么帮助吗？最佳答案如果我理解正确，
javascript - 移动浏览器中的 $(document).height() != $(window).height()
这个问题之前曾被问过(Infinite Scroll on Mobile browsers)，但没有得到回应。我正在尝试实现无限滚动。检查文档是否在底部，导致更多加载的函数是: if ($(win
html - min-height 和 height 属性有什么区别？
这个问题在这里已经有了答案: height:100% VS min-height:100% (4 个答案) 关闭 6 年前。
javascript - 检测用户 browser-height >= page body-height
我在尝试解决这个问题时遇到了一些问题。我已经编写了一个 jquery 函数来检测用户何时点击页面底部并触发一个函数。现在，虽然这适用于最常见的屏幕尺寸，但当用户的屏幕太大以至于可以一次看到整个页面时，
css - 如何: height child gives same height parent . ..？
如何获得与导航高度(填充)相同的导航高度 ...!？ nav { width: 100%; } nav ul { text-align: center; background-
CSS: height % parent with min height % children (相对定位)
所以，实际上我可能完全想多了，应该放弃最小高度，但我目前有以下 HTML:
html - 为什么在这段代码中 Height : auto and Height: 100% on same element
我正在阅读 Bootsrap3 文档。我发现这段页脚代码粘在屏幕底部。 html, body { height: 100%; } #wrap { min-height: 100%; height: a
jquery - CSS height 和 inline height 属性不服从我
我对容器 div 的高度有疑问。我想它是 body 的 100%，但不起作用。我添加了 css body height=100% var d = document; $(d).ready(funct
css-only 100% div height with dynamic height footer
我有一个三部分布局:页眉、内容和页脚。我非常熟悉绝对定位技术；当我希望内容 div 扩展到可用高度的 100% 时，我经常使用它。在这种情况下，我的问题是我事先不知道页脚的高度，它是根据自己的内容动
javascript - window.height 和 document.height 返回相同的值
在下面的代码中，我尝试实现无限滚动。我遇到的问题是“document.height”和“window.height”返回相同的值。有人可以帮我解决我哪里出错了吗？
html - Bootstrap : force image height to height of row
我有一个页面布局，其中两个 div 在一行中彼此相邻对齐。一列包含可变长度的文本，第二列包含图像。标记基本上如下: texttext 我的

首页

博学

6Ren·AI

商城

html - IE 7 问题 : Super simple page - TD height not taking effect