为什么某些DOCTYPE声明会导致100%高亮表格和div停止工作? [英] Why certain DOCTYPE declarations cause 100%-height tables and divs to stop working?
问题描述
在我看来,IE(6-8)中的一些 DOCTYPE
声明可能会导致浏览器忽略 height =100%
在表格和div上( style =height:100%
)
/ p>
<!DOCTYPE html PUBLIC - // W3C // DTD HTML 4.01 Transitional // EN
http ://www.w3.org/TR/html4/loose.dtd>
< html>
< head>
< title> Test1< / title>
< / head>
< body>
< div style =border:2px solid red; height:100%>
Hello World
< / div>
< / body>
< / html>
呈现 DIV
的高度为文字,它不会伸展。删除 DOCTYPE
声明会导致 DIV
根据需要垂直拉伸。
所以我的问题是:
$ b $ ol
DOCTYPE
和仍然允许表格拉伸?-
由于古老的浏览器具有奇怪的不一致的行为,并且浏览器将Doctypes视为智能测试,了解作者是否正在为标准编写代码,或者从十年前的W3School中学到什么。如果你有
height:100%
,并且父元素的高度是auto
,那么100%表示
。auto
-
一般而言,您不会。它尖叫着布局表格。也就是说,设置html和body元素的高度或最小高度。还有其他技术,但我目前没有方便的链接,奇怪的是,我从未处于需要这种技术的位置。
我正在回答这个问题...
It seems to me that some DOCTYPE
declarations in IE (6-8) may cause the browser to ignore height="100%"
on tables and divs (style="height:100%"
)
E.g
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Test1</title>
</head>
<body>
<div style="border: 2px solid red; height: 100%">
Hello World
</div>
</body>
</html>
Will render the DIV
with the height of the text, it will not stretch. Removing the DOCTYPE
declaration causes the DIV
to stretch vertically as desired.
So my questions are:
- Why does it happen?
- How do you keep the
DOCTYPE
and still allow tables to stretch? - Does / did it happen to you?
- Did you know about it?, is it well known?
Because ancient browsers had odd, inconsistent behavior and browsers treat Doctypes like an intelligence test to see if the author is writing code to the standards or to what they learned from W3Schools a decade ago. If you have
height: 100%
and the height of the parent element isauto
then100%
meansauto
.Generally, you don't. It screams "layout table". That said, set heights or minimum heights on the html and body elements. There are other techniques, but I don't have a handy link at the moment as, oddly, I've never been in a position where I needed the technique.
It is what browsers are supposed to do, so …
Well, I am answering this question …
这篇关于为什么某些DOCTYPE声明会导致100%高亮表格和div停止工作?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!