Question

出于某种原因，我之前工作的联系表格突然无法正常运作。基本上，输入字段似乎在Firefox上被禁用，即使它们不是。 Firebug建议他们也不会被禁用，这种行为只适用于firefox，而不是chrome或safari。

HTML

<div class="container-fluid contact-container">
    <div class="row">
        <div class="col-xs-12 col-sm-12 col-md-12 col-lg-10 col-lg-offset-1">
            <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 footer-contact-h">TELL US ABOUT YOUR PROJECT</div>
            <form method="post" id="contact-form">
                <div class="col-xs-12 col-sm-12 col-md-offset-2 col-md-4 col-lg-4 form-row">
                    <div class="form-group">
                        <input name="name" type="text" class="form-control" id="name" placeholder="Name" required="required" autocomplete="off">
                    </div>
                </div>
                <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 form-row">
                    <div class="form-group">
                        <input name="company" type="text" class="form-control" id="company" placeholder="Company" required="required" autocomplete="off">
                    </div>
                </div>
                <div class="col-xs-12 col-sm-12 col-md-offset-2 col-md-4 col-lg-4 form-row">
                    <div class="form-group">
                        <input name="email" type="text" class="form-control" id="email" placeholder="Email" required="required" autocomplete="off">
                    </div>
                </div>
                <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 form-row">
                    <div class="form-group">
                        <input name="phone" type="text" class="form-control" id="phone" placeholder="Phone" required="required" autocomplete="off">
                    </div>
                </div>
                <div class="col-xs-12 col-sm-12 col-md-8 col-md-offset-2 col-lg-8 col-lg-offset-2">
                    <div class="form-group">
                        <textarea name="message" class="form-control" id="message" required="required" placeholder="Details"></textarea>
                    </div>
                </div>
                <div class="col-xs-12 col-sm-12 col-md-4 col-md-offset-4 col-lg-2 col-lg-offset-5">
                    <div class="form-group">
                        <input class="form-control contact-us-button" type="submit" value="CONTACT US">
                    </div>
                    <div class="contact-status">Message Received!</div>
                </div>
            </form>
        </div>
    </div>
</div>

我能够在jsFiddle中复制它：http://jsfiddle.net/tfdcgjh1/

Answer 1

您可以通过在form-control class：

中执行以下操作来解决它

.form-control {
    line-height: 1;
    height: auto;
    -moz-box-sizing: border-box;
}

结帐DEMO

Answer 2

问题似乎是padding中的.form-group input。

删除它，占位符/文本返回。

Updated jsfiddle

在Firefox上输入文本错误，但不是Safari或Chrome

2 个答案: