HTML表单字段在Chrome中不可用，在IE

中工作我正在构建的网站的管理员登录表单不适用于Chrome，但它在IE中正常工作。什么可能导致这个？我在这里发现了另一个关于类似问题的其他问题，但其答案对我并不适用。HTML表单字段在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; 
}

来源

2012-10-24 Jeremy

移除您的身体的z-index CSS中 –

删除#body的position: relative;它将工作

你可以看到光标及其在镀铬也在firefox和safari中测试

enter image description here

来源

2012-10-24 04:20:41

啊！谢谢:)你介意为什么要这样做吗？ – Jeremy

@Jeremy非常欢迎您检查http://css-class.com/test/css/visformatting/layers/z-index.htm和http://www.onextrapixel.com/2009/05/29/an-indepth -coverage-on-css-layers-z-index-relative-and-absolute-positioning /有很好的..你会更容易理解和更有效 –

你需要从-1身体改变你的Z指数的CSS一些积极的东西

body { 
    z-index: 1111; 
}

来源

2012-10-24 04:27:20

而是定位#body得到它下面#nav，你应该定位#nav将高于#body。

#body { ~~position：relative; z-index：-1;~~ ... }

#nav{ 
    position: relative; 
    z-index: 1; 
}

来源

2012-10-24 04:32:00 Musa

HTML表单字段在Chrome中不可用，在IE

回答

相关问题