Question

我有几个单选按钮显示为常规按钮，它们看起来像这样：

            <div class="buttoncontainer" style="position:relative; left: 80px;">
                <label><input type="radio" name="toggle" checked="checked" class="_today">          <span class="css3button-left">Today</span></label>
                <label><input type="radio" name="toggle" class="_tomorrow"><span class="css3button">Tomorrow</span></label>
                <label><input type="radio" name="toggle" class="_weekend"><span class="css3button">This Weekend</span></label>
                <label><input type="radio" name="toggle" class="_nextmonth"><span class="css3button-right">Next Month</span></label>
            </div>

我选择这样的按钮外观如下：

     .buttoncontainer  input:checked + span
     { 
        ...
     }

这适用于我测试的每个浏览器 - IE，FireFox，Chrome，甚至我的计算机上的Safari，但外观永远不会改为：使用Safari在Ipad或Iphone上查看。有没有人知道为什么这些按钮不能只在ipad上工作？

Answer 1

我想你的意思是标签不可点击？

由于某些原因，label元素的常见行为无法在移动WebKit上开箱即用。

将label { cursor: pointer; }添加到CSS可以解决问题。

单选按钮显示不正确

1 个答案: