nhconch 2013年08月14日
莫名其妙的bug——IE6、IE7单元格的高度会影响文本框的宽度?
今天在IE6和IE7遇到的bug把我和小伙伴们都震惊了,见下图:

红色圆圈圈住的地方,那个文本框少了个右边框线,而另外的一个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>


如果把单元格的“height=30”去掉显示就一致了,实在无语!
...全文
55 点赞 收藏 2
写回复
2 条回复

还没有回复,快来抢沙发~

发动态
发帖子
CSS
创建于2007-09-28

3.1w+

社区成员

6.0w+

社区内容

层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
社区公告
暂无公告