DOCTYPE引起的一系列有关问题->Select样式，文本框样式width100%超过父容器

2012-04-28

DOCTYPE引起的一系列问题--Select样式，文本框样式width100%超过父容器一言难尽...各种纠结...环境：IE8当

DOCTYPE引起的一系列问题-->Select样式，文本框样式width100%超过父容器
一言难尽...各种纠结...
环境：IE8
当不写DOCTYPE或者DOCTYPE为<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">之类的

HTML code

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html>    <head>    </head>    <body>        <select>            <option>选项...</option>        </select>        <br><br>        <div style="width:200px;background-color: green;">            &nbsp;        </div>        <div style="width:200px;background-color: red;">            <input type='text' style='width:100%;'>        </div>    </body></html>

IE8显示效果截图：

这个时候，下拉框奇丑无比...但是显示文本框的样式设置为100%没有问题

当吧DOCTYPE 写成HTML5的<!DOCTYPE html>或者 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

HTML code

<!DOCTYPE HTML><html>    <head>    </head>    <body>        <select>            <option>选项...</option>        </select>        <br><br>        <div style="width:200px;background-color: green;">            &nbsp;        </div>        <div style="width:200px;background-color: red;">            <input type='text' style='width:100%;'>        </div>    </body></html>

IE8显示效果截图：

这个时候下拉框变美了...文本框则超出....

哪位大神能解决...这屁问题...已经无语了= =

[解决办法]
http://www.w3school.com.cn/xhtml/xhtml_dtd.asp

各个标准解析稍有不同。

热点排行

CSS

DOCTYPE引起的一系列有关问题->Select样式，文本框样式width100%超过父容器