Foundation .验证错误--“看到了结束div标记，但打开了元素”

Question

我试图使用基础框架对表单进行样式化，它不喜欢将表单的各个部分(即submit按钮)分割为一个全新的行。它抛出这些错误；

结束标记div看到，但有开放的元素。323未闭合元素形式。296迷途末端标签形式。三百二十九

这是一把有用的小提琴

这是我的密码；

<!-- Contact -->
<div class="row"> <!-- dreamweaver says these overlap or unclosed-->
<div class="large-12 small-centered columns"> <!-- dreamweaver says these overlap or unclosed-->
<div class="small-12 small-centered large-9 columns"> <!-- dreamweaver says these overlap or unclosed-->

<form method="post" action="#" id="contact_form">
<div class="row">
<div class="large-6 columns">
<label for="contact_name">Your Name<em>*</em></label>
<input type="text" id="contact_name" name="contact_name" class="required" />
</div>
<div class="large-6 columns">
<label for="contact_email">Your Email<em>*</em></label>
<input type="email"  id="contact_email" name="contact_email" class="required email">
</div>
</div>
<div class="row">
<div class="large-6 columns">
<label for="contact_company">Company Name or Organization</label>
<input type="text" id="contact_company" name="contact_company"/>
</div>
<div class="large-6 columns">
<label for="contact_phone">Phone Number</label>
<input type="tel" id="contact_phone" name="contact_phone"/>
</div>
</div>
<div class="row">
<div class="large-12 columns">
<label for="contact_message">Your Message<em>*</em></label>
<textarea id="contact_message" name="contact_message" class="required"></textarea>
</div>
</div>
</div> <!-- line 323 - dreamweaver says these overlap or unclosed-->
</div> <!-- dreamweaver says these overlap or unclosed-->
</div> <!-- dreamweaver says these overlap or unclosed-->

<div class="row"> <!-- dreamweaver says these overlap or unclosed-->
<div class="large-4 small-centered columns"> <!-- dreamweaver says these overlap or unclosed-->
<input type="submit" name="contact_submit" class="medium button expand-fix no-border" value="SEND MESSAGE"/></form>
</div> <!-- dreamweaver says these overlap or unclosed-->
</div> <!-- dreamweaver says these overlap or unclosed-->

如果我在第323行下嵌套最后一行，它可以工作，但该按钮不按需要填写该列(因为它的宽度不全，因为它是行>行)。

这让我很困惑！谢谢你找我！

Answer 1

您的一个输入元素是未关闭的：

<input type="email"  id="contact_email" name="contact_email" class="required email">

应：

<input type="email"  id="contact_email" name="contact_email" class="required email"/>

此外，更重要的是，表单标记开始于div (以小-12为中心的大-9列)，但该div在表单标记之前关闭。我不知道你的理想布局是什么意思，所以我不能向你显示确切的修复，但有太多的关闭div标签附近的地区，你已经得到了所有的评论。其中有些应该在form元素之后才会关闭。

检查您的代码，并确保您的元素是正确封闭的，并且在关闭其中一个元素的子元素之前，不要关闭它。