Html 邮件表单破坏网站布局

Html 邮件表单破坏网站布局,html,css,layout,Html,Css,Layout,我有这个模板。我所做的只是下载整个模板并将其上载到服务器,当您使用表单提交查询时,不会显示布局中断和发送的成功消息。这可以在上查看。布局来自表单的工作位置。 我已经比较了我能看到的文件和我看不到的错误 有谁能帮助我,而不是等到他们的支持打开 以下是我认为出错的代码: <!-- CONTACT ================================================== --> <section id="contact-page" class="mainc

我有这个模板。我所做的只是下载整个模板并将其上载到服务器,当您使用表单提交查询时,不会显示布局中断和发送的成功消息。这可以在上查看。布局来自表单的工作位置。 我已经比较了我能看到的文件和我看不到的错误

有谁能帮助我,而不是等到他们的支持打开

以下是我认为出错的代码:

<!-- CONTACT
================================================== -->
<section id="contact-page" class="maincolorbg">
<div class="container">
    <div class="starter-template">
        <h1>Contact</h1>

        <div class="smallsep">
        </div>
        <p class="lead">
            Send us a message to request a free no obligation quotation,<br/>
            or simply enquire and get prompt answers within 24 hours.
        </p>
    </div>
    <form id="contact" name="contact" method="post">
        <fieldset>
            <div class="row">
                <div class="col-md-4 wow fadeIn animated animated" data-wow-delay="0.1s" data-wow-duration="2s">
                    <label for="name" id="name">Name<span class="required">*</span></label>
                    <input type="text" name="name" id="name" size="30" value="" required/>
                </div>
                <div class="col-md-4 wow fadeIn animated" data-wow-delay="0.3s" data-wow-duration="2s">
                    <label for="email" id="email">Email<span class="required">*</span></label>
                    <input type="text" name="email" id="email" size="30" value="" required/>
                </div>
                <div class="col-md-4 wow fadeIn animated" data-wow-delay="0.5s" data-wow-duration="2s">
                    <label for="phone" id="phone">Phone<span class="required">*</span></label>
                    <input type="text" name="phone" id="phone" size="30" value=""/>
                </div>
            </div>
            <div class="wow fadeIn animated" data-wow-delay="0.8s" data-wow-duration="1.5" style="margin-top:15px;">
                <label for="Message" id="message">Message<span class="required">*</span></label>
                <textarea name="message" id="message" required></textarea>
            </div>
            <div class="wow fadeIn animated" data-wow-delay="1s" data-wow-duration="2s">
                <input id="submit" type="submit" name="submit" value="Send"/>
            </div>
        </fieldset>
    </form>
    <div id="success">
    <span>
    <p style="margin-top:20px;">
        Your message was sent successfully! I will be in touch as soon as I can.
    </p>
    </span>
    </div>
    <div id="error">
    <span>
    <p>
        Something went wrong, try refreshing and submitting the form again.
    </p>
    </span>
    </div>
</div>
</section>

这是我自己想出来的

如果有人发现同样的问题,请参见下面的答案

    <div id="success">

        <p style="margin-top:20px;">

            Your message was sent succssfully! I will be in touch as soon as I can.
        </p>

    </div>
    <div id="error">
    <span>
    <p>
        Something went wrong, try refreshing and submitting the form again.
    </p>
    </span>
    </div>
</div>
</section>

对不起,这里没有人想翻阅别人的大量代码。如果您需要我们的帮助,那么您必须发布一个简单的简化示例,演示您的问题以及简化的代码。懒惰和只发布指向任意站点的链接在这里被认为是一个坏习惯。我在上面添加了可疑代码,将a放在a中是没有意义的。通过W3C验证程序运行您的标记以查看任何无效的HTML。如果您的问题中不包含任何关于这些内容的内容,请不要使用、和标记。@sparky-该模板是一个引导模板,使用jquery邮件表单,该表单也包含php。如果有必要,我也可以上传这些代码
    <div id="success">

        <p style="margin-top:20px;">

            Your message was sent succssfully! I will be in touch as soon as I can.
        </p>

    </div>
    <div id="error">
    <span>
    <p>
        Something went wrong, try refreshing and submitting the form again.
    </p>
    </span>
    </div>
</div>
</section>