IPAD Mini - IOS 7.0 - 双选框重叠

I have two select boxes as show on the image above. Now the issue is that when I click on the year field, the month field is still being triggered. Seemed like the area for the first select box is too wide or there is some kind of overlap.

我有两个选择框如上图所示。现在的问题是，当我点击年份字段时，仍然会触发月份字段。看起来像第一个选择框的区域太宽或有某种重叠。

Anyone know a work around for this please?

有人知道为此工作吗？

This is a web app by the way, if that helps. :)

顺便说一下，这是一个网络应用程序，如果这有帮助的话。 :)

        <label>
            <span>Expiration</span><br>
            <select class="card-expiry-month input-mini">
                <option value="01" >01</option>
            </select>   
            <select class="card-expiry-year input-mini">
                <option value="2014">2014</option>            
            </select>            
       </label>

Not sure if it's because of the label?

不确定是不是因为标签？

1 个解决方案

#1

It's because you have the <label> surrounding both elements. If you move the label to not wrap both elements, it will work:

这是因为你有两个元素的。如果将标签移动到不包装两个元素，它将起作用：

<label>
    <span>Expiration</span><br>
    <select class="card-expiry-month input-mini">
        <option value="01" >01</option>
    </select>
</label>
<label>
    <select class="card-expiry-year input-mini">
        <option value="2014">2014</option>            
    </select>
</label>