What does the “~” (tilde/squiggle/twiddle) CSS selector mean?

Question

Searching for the ~ character isn\'t easy. I was looking over some CSS and found this

.check:checked ~ .content {
}

What does

Answer 1

It is General sibling combinator and is explained in @Salaman's answer very well.

What I did miss is Adjacent sibling combinator which is + and is closely related to ~.

example would be

.a + .b {
  background-color: #ff0000;
}


  
1st
  
2nd
  
3rd
  
4th
  
5th

• Matches elements that are .b
• Are adjacent to .a
• After .a in HTML

In example above it will mark 2nd li but not 4th.

   .a + .b {
     background-color: #ff0000;
   }

  
1st
  
2nd
  
3rd
  
4th
  
5th

JSFiddle