Searching for the ~
character isn't easy. I was looking over some CSS and found this
.check:checked ~ .content {
}
What does it mean?
csscss-selectors
Searching for the ~
character isn't easy. I was looking over some CSS and found this
.check:checked ~ .content {
}
What does it mean?
Best Answer
The
~
selector is in fact the General sibling combinator (renamed to Subsequent-sibling combinator in selectors Level 4):Consider the following example:
.a ~ .b
matches the 4th and 5th list item because they:.b
elements.a
.a
in HTML source order.Likewise,
.check:checked ~ .content
matches all.content
elements that are siblings of.check:checked
and appear after it.