What does symbol tilde (~) mean in CSS [duplicate]

Answer 1

It applies the style to all elements matching the second selector if they appear after the elements matching the first selector. For example, given an HTML snippet and CSS rule:

hr ~ p {
    font-weight: bold;
}

Line one

Line two
Line three

only

Line two

and

Line three

will appear bold. In your example, I think Visual Studio is having a problem interpreting the :hover modifier, since it isn't really an element. If you remove it from the rule, it may work correctly.