[英]HTML form fields not usable in chrome, works in IE
我正在建立的网站的管理员登录表单无法在chrome中使用,但在IE中可以正常使用。 是什么原因造成的? 我在这里找到了另一个关于类似问题的问题,但是它的答案对我不起作用。
预览: http : //a.emutek.net/site/admin/
HTML:
<div id="body">
<div class="divhead" id="adminhead">Login to website management:</div>
<div id="adminlogin">
<form name="adminlogon" action="login.do.php" method="post">
<table border="0">
<tr>
<td>
Username:
</td>
<td>
<input type="text" name="user">
</td>
</tr>
<tr>
<td>
Password:
</td>
<td>
<input type="password" name="pwd">
</td>
</tr>
</table>
<input type="submit" value="Submit">
</form>
</div>
</div>
CSS:
#body {
z-index: -1;
position: relative;
top: -6px;
padding: 7px;
background-color: white;
border-radius: 6px;
}
.divhead{
background-color: #111;
color: #CCC;
text-transform: uppercase;
font: bold 12px Arial, Helvetica;
text-decoration: none;
padding: 3px;
margin-bottom: 5px;
border-radius: 6px;
}
#head{
border-radius: 6px;
margin-bottom: -10px;
padding: 5px;
background-image:url('../img/bg_header.png');
}
#adminlogin{
margin-left: 40%;
z-index: 10;
}
#adminhead{
margin-top: 20px;
margin-bottom: 10px;
width: 700px;
margin-right: auto;
margin-left: auto;
padding-left: 20px;
}
取消position: relative;
在#body
它将起作用
您可以看到光标在chrome中也经过了Firefox和Safari的测试
相反定位的#body
得到它下面#nav
,你应该定位#nav
将高于#body
。
#body { 职位:相对; z索引:-1; ...}
#nav{
position: relative;
z-index: 1;
}
您需要将体内的z索引CSS从-1更改为正数
body {
z-index: 1111;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.