2013-03-04 25 views
5

このコードは、デスクトップ上のChromeで正常に動作しますが、アンドロイドではない株式ブラウザ:CSS - 兄弟セレクタがアンドロイドで動作していませんか?

<!DOCTYPE html> 
<html> 
<head> 
<style type="text/css"> 
input:checked ~ span {color:red;} 
</style> 
</head> 
<body> 
<label> 
<input type="checkbox" /> 
<span>First item</span> 
</label> 
</body> 
</html> 

あなたは敬遠しがちチェックマークをクリックすると、基本的には、spanタグのテキストが赤に変わります。アンドロイド4.0のGalaxy Noteで赤色に変わっていません。

私のコードで何が問題になっていますか?

答えて

8

http://quirksmode.org/css/selectors/mobile.html

兄弟セレクタは

がサポートされています:チェックを擬似クラスは理にかなって

+0

OKではありません。あなたはアンドロイドですべてのチェックボックスを取得する代わりに私はどのCSSルールを知っていますか? input [checked = "checked"]は私に何も与えませんでした。 – John

+1

動作するハックがいくつかあるようです。 [これをチェックしてください](http://stackoverflow.com/questions/8320530/webkit-bug-with-hover-and-multiple-adjacent-sibling-selectors/8320736#8320736)、この入力を試してください[type = checkbox ]:チェック – ElefantPhace

+1

http://css-tricks.com/forums/discussion/18225/checkbox-hack-on-mobile-webkit/p1 – ElefantPhace

関連する問題