神奇的IE6、IE7,莫名其妙的bug——单元格的高度会影响文本框的宽度?
来源:互联网 发布:linux 删除所有文件 编辑:程序博客网 时间:2024/06/08 02:02
很多时候古老浏览器带来的问题往往出乎我们意料,而多数时候我们都能找到一个原因来解释这个bug,但今天在IE6和IE7遇到的bug确实让摸不着头脑,见下图:
从图片可以看到有两个问题:
1、表格右边框线不见了;
2、红色圆圈圈住的地方,那个文本框少了个右边框线,而另外的一个Textare和input则显示完好。
问题重现的HTML源代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" ><head><meta http-equiv="Content-Type" content="text/html; charset=GBK" /><title>XX系统</title><style type="text/css">*{padding:0px;margin:0px auto;}body{margin:0;padding:0;border:0;height:100%;text-align:left;background-color:#FFFFFF;} div,li,td,th,caption,p,select,input,textarea,a,button,label{font:12px Verdana, Arial, Helvetica, sans-serif, "微软雅黑", "宋体";color:#404040;text-decoration: none;}form{margin:0;padding:0}select,input,button,label,span{vertical-align: middle;}table {border-collapse:collapse;}td {border:1px solid #e4e4e4;padding:2px;}.textbox {border:1px solid #bfbfbf;height:20px;line-height:20px;vertical-align:middle;}.textarea {border:1px solid #bfbfbf;}</style></head><body style="background-color:#f8f8f8;"><form id="form1" name="form1" method="post"><table border="0" cellpadding="0" cellspacing="0" width="90%"><tr><td height=30 align="center">管理机构</td> <td><input id="organ" name="organ" type="text" value="aaaa" class="textbox" maxlength=150 style="width:100%;"></td></tr><tr><td align="center">备注</td> <td><textarea id='memo' name='memo' type='text' class='textarea' style='width:100%;' rows='3'>bbbb</textarea></td></tr><tr><td align="center" class="ybg">处理状况</td> <td class="ybg"><input id="note_status" name="note_status" type="text" value="cccc" class="textbox" maxlength=80 style="width:100%;"></td></tr></table></form></body></html>
问题1可以归究到IE6、IE7的盒子模型上。问题2则让人相当费解,如果把单元格的“height=30”去掉显示就一致了,实在无语!
- 神奇的IE6、IE7,莫名其妙的bug——单元格的高度会影响文本框的宽度?
- ie6,ie7的bug
- flex datagrid有时候高度也会影响宽度的
- 莫名其妙的神奇背包
- IE6 IE7 丢失cookie的bug!
- 解决 IE6 IE7 onresize的bug
- IE6 IE7上的window.resize bug
- 修正IE6 IE7的window.resize bug
- 解决 IE6 IE7 onresize的bug
- POI设置单元格的宽度和高度
- IE6的最大最小高度和宽度
- IE6下a标签无法点击bug----position和定义的宽度和高度
- IE6下DIV高度显示的Bug
- 关于ie6下iframe的高度bug
- IE6下DIV高度显示的Bug
- IE6 IE7: div中 table 宽度100% 引发的血案
- ie6,ie7的问题
- IE6、IE7的兼容问题
- GDI+使用步骤
- 获取Android IP地址代码
- tr命令的使用说明
- Eclipse 代码提示不显示的问题
- PythonChallenge 挑战之路 Level-28
- 神奇的IE6、IE7,莫名其妙的bug——单元格的高度会影响文本框的宽度?
- apache mina IoBuffer prefixedDataAvailable
- QT输出debug log
- POJ 2749 - Building roads 构图2-sat..注意!POJ爆WA也有可能是数组越界!
- MVC 3.0 在各个版本IIS中的部署
- 字典树 ZOJ1109 HDU1251 PKU1204 HDU1075
- 乔布斯:重塑世界的科技创想家
- 白宝泉:《微波的应用-微波法检测》
- 王石:什么是企业家精神?