0

这是一个非常奇怪的问题。在显示表单上（单击“价格并保存我的购物清单”），我认为由于某种原因文本框和下拉菜单被禁用。不是这种情况; 但是，它只允许我单击控件最右侧的它们——我必须将下拉菜单从“小”增加到“中”才能完全与之交互。我不知道为什么会发生这种情况，甚至想不出谷歌会做什么。因此，我查看了与 Foundation Reveal 相关的所有内容，但无济于事。

这是 jsfiddle，但虽然它适用于我的网站，但它不适用于 jsfiddle。如果你想看到它在行动，我会给你一个链接到我的网站。：http: //jsfiddle.net/jenborn/TQjm9/

这是模态形式，因为如果我链接到 jsfiddle，显然我必须包含代码：

  <form id="saveShoppingList" action="" method="POST" class="custom">
   <div class="small-12 columns">
     <div class="small-6 small-centered columns"><h4>Your Shopping List</h4></div>
     <div id="makemebold" class="large-4 columns"><!--label for="name"-->Name it: <!--/label--></div>
     <div class="small-8 columns"><input type="text" id="name" name="name" /></div>
     <div id="makemebold" class="small-4 columns"><!--label for="style"-->Style: <!--/label--></div>
     <div class="small-8 columns"><select id="beer_style"  class="medium"><? echo $style_opt ?></select></div>
     <div id="makemebold" class="large-4 columns">Keep Private:</div>
     <div class="small-3 left columns"><div class="switch tiny round"><input id="private" name="private" type="radio"><label for="private" onclick="Off">On</label><span></span></div></div>
   </div>

  <div class="row">
   <div class="small-6 large-centered columns">
     <button type="submit" class="button radius">Go</button>
     <button type="reset" class="button radius alert">Reset</button>
  </div>
  </form>
4

1 回答 1

0

您在使用 Foundation 的网格时遇到了一些重大问题。您的后续列总计超过 12 个，并且列嵌套在其他列中而没有插入行。如果您通过Foundation Docs 的网格部分并相应地重写您的代码，我敢打赌您的问题将得到解决。请特别注意标题为“无限嵌套您的网格”的部分。

我还建议进行基本的改进，例如label为表单标签使用元素，因为浏览器会知道如何更好地使用它们。当然，对于语义。

于 2013-10-24T19:30:28.237 回答