Menu
This code works fine in Chrome on desktop, but not android stock browser:
<!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>
Basically when you click hte check mark, the span tag text should turn red. It's not turning red on my Galaxy Note with android 4.0.
What's wrong with my code?
979
Adjacent Sibling Selector (+) The adjacent sibling selector is used to select an element that is directly after another specific element. Sibling elements must have the same parent element, and "adjacent" means "immediately following".
The general sibling combinator ( ~ ) separates two selectors and matches all iterations of the second element, that are following the first element (though not necessarily immediately), and are children of the same parent element.
The CSS adjacent sibling selector is used to select the adjacent sibling of an element. It is used to select only those elements which immediately follow the first selector.
The adjacent sibling selector is different from the general sibling selector as it selects only the element that immediately follows an element, whereas the general sibling selector selects any element that follows an element.
http://quirksmode.org/css/selectors/mobile.html
The sibling selector is supported
the :checked pseudo-class is not
60
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
