Heim > Web-Frontend > HTML-Tutorial > 在ie下的兼容性问题,<input>的显示【求助】_html/css_WEB-ITnose

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

WBOY
Freigeben: 2016-06-24 12:23:29
Original
1496 Leute haben es durchsucht

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


<style type="text/css">  #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 language="javascript">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 style="width:960px;height:216px;margin:auto;"><div id="check"><div id="checkinput"> <form  name="formQuery" method="post" action="http://www.88315.org/chinese/checkFWM.asp"><input type="text" language=javascript onkeyup="return fwm1_onkeyup()" maxLength=4 size=4name=fwm1>-<input type="text" language=javascript onKeyUp="return fwm2_onkeyup()" maxLength=4 size=4name=fwm2>-<input type="text" language=javascript onKeyUp="return fwm3_onkeyup()" maxLength=4 size=4name=fwm3>-<input type="text" maxLength=4 size=4 name=fwm4 ><input id="checkbutton1" type="submit"  value=""  onClick="javascript:fsubmit(document.formQuery);" ><input id="checkbutton2" type="button" value="" onClick="javascript:freset(document.formQuery);" ></form></div><SCRIPT language=VBscript src="focus.js"></SCRIPT></div></div>
Nach dem Login kopieren


回复讨论(解决方案)

自己沙发一下 期待~

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

IE8是竖着的,很奇怪。

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

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

<div style="width:960px;height:216px;margin: auto; text-align:center;">
Nach dem Login kopieren
Nach dem Login kopieren

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

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

<div style="width:960px;height:216px;margin: auto; text-align:center;">
Nach dem Login kopieren
Nach dem Login kopieren



原来只有ie8才这样。呵呵谢谢呀,已经解决

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage