CSS 为什么 <div style="width:50%" /> 没有在 xHTML 中呈现？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/1616822/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Why <div style="width:50%" /> is not rendered in xHTML?
提问by Artem
Why <div style="width:50%" />is not rendered in xHTML?
If I do <div style="width:50%"> </div>only then it is rendered. Do I miss something?
Will min-width help?
I use strict xHTML 1.0
为什么<div style="width:50%" />不在 xHTML 中呈现？如果我<div style="width:50%"> </div>只这样做，它就会被渲染。我错过了什么吗？min-width 有帮助吗？我使用严格的 xHTML 1.0
Is it possible to fix it with CSS only or I must change html markup?
是否可以仅使用 CSS 修复它，或者我必须更改 html 标记？
回答by random
Because DIVis not a self-closing element in either XHTML orHTML.
因为DIV在 XHTML或HTML 中都不是自闭合元素。
You must pair the opening tag (<div>) with the closing (</div>) .
您必须将开始标记 ( <div>) 与结束标记 ( )配对</div>。
On the other part of your question:
在你问题的另一部分：
<div style="width:50%"> </div>
<div style="width:50%"></div>
The difference between is that in the first there is a non-breaking space character that fills up the DIV. In the second there is nothing. That is why you will not see anything render on the second version.
两者之间的区别在于，在第一个中有一个不间断的空格字符填充DIV. 在第二个什么都没有。这就是为什么您在第二个版本上看不到任何渲染的原因。
Also, XML and XHTML are not the same thing. The latter borrows the convention of self-closing a tag if it's not part of a matching pair.
此外，XML 和 XHTML 不是一回事。如果它不是匹配对的一部分，后者借用了自关闭标签的约定。
回答by bobince
Although a self-closing <div />should generally be avoided in XHTML (because it won't parse as expected in legacy HTML browsers), this is not actually anything to do with XHTML: it's a layout issue.
尽管<div />在 XHTML 中通常应该避免自关闭（因为它不会在传统 HTML 浏览器中按预期进行解析），但这实际上与 XHTML 没有任何关系：这是一个布局问题。
<div></div>
is a block element containing no content. Its height is therefore zero; you can't see it.
是一个不包含任何内容的块元素。因此它的高度为零；你看不到它。
<div> </div>
is a block element containing one line of text. Its height is equal to the line-heightproperty.
是包含一行文本的块元素。它的高度等于line-height属性。
If you want an empty div to have some height, you must say so:
如果你想让一个空的 div 有一些高度，你必须这样说：
<div style="width: 50%; height: 2em; background: red;"></div>
It is an old IE5 bug that an empty div would still render with height as if it contained a line of text. When you are using a Standards Mode doctype (which you should be regardless of whether you are using HTML or XHTML, Transitional or Strict), you won't see this behaviour.
这是一个旧的 IE5 错误，一个空的 div 仍然会以高度呈现，就好像它包含一行文本一样。当您使用标准模式文档类型（无论您使用的是 HTML 还是 XHTML，过渡或严格），您都不会看到这种行为。
回答by eozzy
Allowed self-closing tags in XHTML are the following:
XHTML 中允许的自闭合标签如下：
<area />
<base />
<basefont />
<br />
<hr />
<input />
<img />
<link />
<meta />
DIV must have both starting and ending tags.
DIV 必须同时具有开始和结束标记。
