css - 基础 CSS 框架下拉选择

Question

我正在使用 Foundation CSS。但是我将下拉选择用作简单的 HTML 标记。

问题是下拉菜单不适用于小型(移动)窗口。

我在这里重现了错误http://jsfiddle.net/BZrT8/1/ (在 CSS block 中，我添加了我使用的 foundation.css 和 main.css)。

我发现问题是foundation.css中.row.mobile-three属性的float:left;属性引起的

知道为什么 float:left; 使下拉列表不起作用吗？以及如何解决？

Answer 1

您有一个 div 在窄屏幕上与您的选择重叠:

<div class="seven columns"></div>

你看不到它，因为它没有内容或背景。它向右浮动并占据空间；因为它稍后在 DOM 中，所以它在您的选择范围内。

删除此 div 或重新定位/重新 float 它。