在ie下的兼容性问题，<input>的显示【求助】_html/css_WEB-ITnose

2016-06-24 12:23 1813浏览原创

关于兼容性问题，在mac下的safari跟chrome都没有问题，win下的chrome也基本没问题，就是在ie下面有问题。
那四个输入框始终不能正常显示(一横排显示)，希望大家帮我看看应该调试哪里呢？
弄了一下午了，头好晕……初学html让大家见笑了

<style>  #check{float: left;width:937px;height:216px;background: url(http://9.pic20.dianzhanggui.net/33402_d26bb2700aa125eaa28db3f84cb441fc/20130820/43261c5032b9b263.png) no-repeat;border:none;    margin: auto;    position:absolute;  }  #checkinput{float:left;border:none;width:352px;height:26px;color:#333333;font-size:12px;padding-top: 69px;padding-left: 585px;}  #checkbutton1{display:block;width:60px;height: 20px;margin-left: 160px;margin-top:11px;border:none;background:url(http://3.pic20.dianzhanggui.net/33402_d26bb2700aa125eaa28db3f84cb441fc/20130820/2e42b9d8c50683f8.png);cursor:pointer;position:absolute;}  #checkbutton2{display: block;margin-left:231px;margin-top:11px;width:60px;height:20px;border: none;background: url(http://4.pic20.dianzhanggui.net/33402_d26bb2700aa125eaa28db3f84cb441fc/20130820/b28c3bf9da9414c4.png);cursor: pointer;margin-top: 11px;position:absolute;}  input {border: #006837 1px solid; border-top: #006837 1px solid; font-size: 14px; border-left: #006837 1px solid; border-bottom: #006837 1px solid; font-family:"宋体","Verdana"; background: #ffffff;text-align: center;}</style><script>function fsubmit(obj){obj.submit();}function freset(obj){obj.reset();}function fwm1_onkeyup() {if (document.formQuery.fwm1.value.length == 4) {document.formQuery.fwm2.focus();}}function fwm2_onkeyup() {if (document.formQuery.fwm2.value.length == 4) {document.formQuery.fwm3.focus();}}function fwm3_onkeyup() {if (document.formQuery.fwm3.value.length == 4) {document.formQuery.fwm4.focus();}}//--></script><div><div>
<div> <form>
<input>-<input>-<input>-<input><input><input>
</form>
</div>
<script></script>
</div></div>

回复讨论(解决方案)

自己沙发一下期待~

ie几是竖着呀，我的ie10,ie6,ie7都是横成一排的

IE8是竖着的，很奇怪。

你如果把 #checkinput样式里的width:352px去掉，就可以了，不确定原因。但是两个button的位置需要调整一下。

另外IE8中margin:auto不能保证居中生效，这是IE8的一个bug，因此你也需要调整一下：
比如最外层的div：

<div>  <br><p class="sougouAnswer">  你如果把 #checkinput样式里的width:352px去掉，就可以了，不确定原因。 但是两个button的位置需要调整一下。  <br><br> 另外IE8中margin:auto不能保证居中生效，这是IE8的一个bug，因此你也需要调整一下：  <br> 比如最外层的div：  <br></p>
<pre class="sycode" name="code"><div>  <br><br><br> 原来只有ie8才这样。呵呵谢谢呀，已经解决 </div>