Internet Explorer 8中的HTML提交按钮定位问题

Question

在Chrome和firefox上几乎是正确的，但是问题是IE上的提交按钮的位置（如果比CSS正确）。 请检查代码并尽快提供帮助。

您可以在链接http://jsfiddle.net/7vUW6/上找到HTML和CSS代码

Answer 1

如果要居中，请删除class =“ submit”并将其替换为style =“ text-align：center;”。 这将使按钮在行中居中。

同样对于IE，不要忘记在标记中指定DOCTYPE声明。 用这个：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">

Answer 2

我看到了您的编码并解决了这些问题，您在输入框中未设置正确的宽度时犯了一些错误。 然后提交按钮也是我解决问题并检查所有浏览器现在对齐是否正确。编辑代码如下。 请复制此代码并运行您的系统。

完整的编码：

    <!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=utf-8" />
    <title>Customer Advance and Project Registration System | Ymoff Technologies Pvt. Ltd.</title>
    <meta name="description" content="This is Project Registration and Customer Advance Payment Recept System designed and developed for Ymoff Technologies." />
    <link type="text/css" rel="stylesheet" href="stylesheets/style.css" />
    <link rel="shortcut icon" href="favicon.ico" />
    <script src="js/jquery-1.6.4.js"></script>
      <script type="text/javascript" src="js/jquery.validate.js"></script>
      <script>
      $(document).ready(function(){
        $("#form1").validate();
      });
      </script>
    <script type="text/javascript">
        function clearThis(target){
            target.value= "";
        }
        </script>
    <script type="text/javascript">
    function autoGrow (oField) {
      if (oField.scrollHeight > oField.clientHeight) {
        oField.style.height = oField.scrollHeight + "px";
      }
    }
    </script>

    <style>
    /*-- Reset CSS --*/
    .wraper{
            width:70%;
            margin: 0px auto;
            padding:0;
        }

        #field {

        }
        #ftext{
            font-family: 'Capriola', sans-serif;
        }
        #btext{
            font-family: 'Quando', serif;
            font-weight:400;
        }
        #space{
            padding-left:5%;
        }
        .submit{
            padding-left:54%;
            padding-right:60%;
            clear:both;
        }
        #value{
            color:#999;
        }
        textarea {
      resize: none;
    }
    #noscrollbars {
        overflow:hidden;
    }
    #inform{
        color:#C00;
        font-size:12px;
        text-align:justify;
    }
    select{
        color:#00F;
    }
    textarea{
        border-right: #a9a9a9 1px solid;
      border-top: #a9a9a9 1px solid;
      border-left: #a9a9a9 1px solid;
      border-bottom: #a9a9a9 1px solid;
      color:#00F;
    }
    #show1{
        color:#10e684;
        font-size:18px;
        font-weight:600;
    }
    #show2{
        color:#9e2a28;
        font-size:18px;
        font-weight:600;
    }
    #show3{
        color:#9e2a28;
        font-size:10px;
    }
    fieldset{
        width:400px;
        padding-top:5px;
    }
    legend{
        font-family: "Quando", serif;
    }

    .umame
    {

        text-align:right;
        float:left;
        padding-bottom:5px;
        padding-right:8px;
    }
    .umame1
    {

        text-align:left;
        float:left;
        padding:0px;
        margin:0px;
        padding-bottom:5px;
    }

    </style>
    </head>

    <body class="wraper">
    <div>
        <img src="images/dashboardlogin.png" style="padding-top:10px; padding-left:15%;"  />
        <br />
        <br />
        <div class="container">
        <center>
        <br  /><br  /><br  />
        <h2 id="btext">Please perfectly enter the following fields :</h2>
           <form name="login" action="" method="post">
           <fieldset>
           <table width="337" cellpadding="0" cellspacing="0" border="0">
           <tr>
               <td width="169" class="umame">
               <span id="ftext">Client Registration ID <span style="color:#C00;">*</span></span>
               </td>
                   <td width="156" class="umame1">
                   <input type="text" name="userid" value="Cleint Registraion ID" style="color:#999; width:156px;" onfocus="if(this.value==this.defaultValue){this.value='';}this.style.color='#000';" onblur="if(this.value==''){this.value=this.defaultValue;this.style.color='#999';}" />
                   </td>
           </tr>
           <tr>
               <td class="umame" width="169">
               <span id="ftext">Temporary Password <span style="color:#C00;">*</span></span>
               </td>
                    <td width="156" class="umame1">
                   <input type="password" name="password" value="***************" style="color:#999; width:156px;" onfocus="if(this.value==this.defaultValue){this.value='';}this.style.color='#000';" onblur="if(this.value==''){this.value=this.defaultValue;this.style.color='#999';}" />
                   </td>
           </tr>
           <tr>
               <td class="umame" width="169"> &nbsp;</td>
               <td width="156" class="umame1">
               <input type="submit" name="ok" value="Login" />
               </td>
           </tr>
           </table>
           </fieldset>
           </form>
           <table width="337">
           <tr>
                   <td ><span id="inform"><br />
                     * Marks fields are sent to you by E-Mail when your project has been registered with us. If any how if you lost our mail and want to get your Password, please visit this link <a href="#">Get Password</a> with your YMOFF Registration ID. </span>
                   </td>
           </tr>
           </table>

          </center>
      </div>
    </div>

    </body>
    </html>

Internet Explorer 8中的HTML提交按钮定位问题

问题描述

2 个解决方案

解决方案1
0 2012-08-07 19:17:48

解决方案2
0 已采纳 2012-08-07 19:57:22

完整的编码：

Internet Explorer 8中的HTML提交按钮定位问题

问题描述

2 个解决方案

解决方案1 0 2012-08-07 19:17:48

解决方案2 0 已采纳 2012-08-07 19:57:22

完整的编码：

解决方案1
0 2012-08-07 19:17:48

解决方案2
0 已采纳 2012-08-07 19:57:22