响应式“提交”按钮 - 移动版

Question

我在这个问题上遇到了很大的困难；我已经绞尽脑汁好几个小时了，我正要拔掉我的头发..

我有一个表格：

<div class="inforight-contact">

<form action="contact-sent.php" method="post" enctype="multipart/form-data" name="form" id="form">
<p>

<label class="input">
<span>Name</span>
<input type="text" name="Name" id="Name" class="name"/>
</label>
</p>
                  <p>
<label class="input">
<span>Email</span>
<input type="text" name="Email" id="Email" class="email" />
</label>
</p>


<p>
<label class="input">
<span>Subject</span>
<input type="text" name="Subject" id="Subject" class="subject" />
</label>
</p> 

<p>
<label for="fileField">Comments:</label>
<label for="Comments"></label>
<textarea name="Comments" id="Comments" class="comments" cols="90" rows="4"></textarea>
</p>
<p>
<input type="image" id="submit" class="submit" />
</p>
</form>

</div>

这是我的响应式 CSS：

form {
margin-right: 0x;
margin-top: 20px;
        }

form label {
            display: block;
            text-align: center;
            margin-top: 0px;
            padding-bottom: 5px;
        }

form .submit {
            -webkit-appearance: none;
            border: 0px;
            background: #EA5310;
            width: 100%;
            border-radius: 0.50em;
            margin: 0em 0em;
            padding: 0.7em 1em;
            box-shadow: inset 0 0.1em 0.1em 0 rgba(0,0,0,0.05);
            -moz-transition: all 0.35s ease-in-out;
            -webkit-transition: all 0.35s ease-in-out;
            -o-transition: all 0.35s ease-in-out;
            -ms-transition: all 0.35s ease-in-out;
            transition: all 0.35s ease-in-out;
            font-family: "Roboto",sans-serif;
            font-size: 10pt;
            font-weight: lighter;
            color: #fff;
            outline: none;
            cursor: pointer;
            display: block;
            text-align: center;
            height: 20px;
        }





form input.name,
form input.email,
form input.tel,
form input.subject {
            -webkit-appearance: none;
            border: 0;
            background: #f3f4f5;
            width: 100%;
            border-radius: 0.50em;
            margin: 0em 0em;
            padding: 0.7em 1em;
            box-shadow: inset 0 0.1em 0.1em 0 rgba(0,0,0,0.05);
            -moz-transition: all 0.35s ease-in-out;
            -webkit-transition: all 0.35s ease-in-out;
            -o-transition: all 0.35s ease-in-out;
            -ms-transition: all 0.35s ease-in-out;
            transition: all 0.35s ease-in-out;
            font-family: "Roboto",sans-serif;
            font-size: 10pt;
            font-weight: lighter;
            color: #777;
            outline: none;
            text-align: center;
        }


form input.name:focus,
form input.tel:focus,
form input.email:focus,
form input.subject:focus
            {
                box-shadow: 0 0 2px 1px #E0E0E0;
                background: #fff;
            }


form textarea.comments {
            -webkit-appearance: none;
            border: 0;
            background: #f3f4f5;
            width: 100%;
            border-radius: 0.50em;
            margin: 0em 0em;
            padding: 0.7em 1em;
            box-shadow: inset 0 0.1em 0.1em 0 rgba(0,0,0,0.05);
            -moz-transition: all 0.35s ease-in-out;
            -webkit-transition: all 0.35s ease-in-out;
            -o-transition: all 0.35s ease-in-out;
            -ms-transition: all 0.35s ease-in-out;
            transition: all 0.35s ease-in-out;
            font-family: "Roboto",sans-serif;
            font-size: 10pt;
            font-weight: lighter;
            color: #777;
            outline: none;
        }


form input.comments:focus
            {
                box-shadow: 0 0 2px 1px #E0E0E0;
                background: #fff;
            }

我遇到的问题是“提交”按钮文本不会位于中心。它位于对齐：左。如果我将桌面屏幕缩小到移动大小，并且如果我使用 screenfly 或 Firefox 的响应式网站之类的东西，但在我的移动设备上它与左侧对齐并且文本周围有一个白框，它看起来很好。这使得识别问题变得非常困难，因为我只能在手机上看到问题。 Firebug 应用程序列出了我所有的 .css 样式，并显示它应该位于 text-align: center，但事实并非如此。谁能看到我看不到的东西？如果您需要更多代码，请告诉我。

Answer 1

替换以下代码：

<input type="image" id="submit" class="submit" />

通过

<input type="text" id="submit" class="submit" value="Submit" />