显示不正确

我有显示像普通按钮的几个单选按钮单选按钮，它们看起来就像这样：显示不正确

  <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？

来源

2012-08-06 Scott Selby

你能告诉我们你想要它看起来像什么吗？ – 2012-08-06 15:27:35

我只想：检查火来改变外观，我可以发布所有的CSS，如果你想 – 2012-08-06 15:29:45

请给我们显示它的截图在浏览器中看起来像在手机上看起来像什么。 – 2012-08-06 15:31:59

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

由于某些原因，label元素的常见行为不适用于开箱即用的移动WebKit。

将label { cursor: pointer; }添加到CSS可修复此问题。

来源

2012-08-06 16:59:56 Jona

不，他们是可点击的，他们的工作，问题是，CSS不会改变：检查版本的CSS – 2012-08-06 17:02:07

@ScottSelby嗯奇怪的是，这是我尝试你的代码片段时遇到的问题（'：checked + span'样式被正确应用）。你可能应该在你的问题的评论中添加CSS和一些像statet这样的截图。 – Jona 2012-08-06 17:25:20

它在我试过的每个浏览器中都能正常工作，除了IPad – 2012-08-06 19:07:50

回答

相关问题