Difference between CSS + selector and ~ selector

I saw a .class1 ~ .class2 selector today, and had to look it up.

div ~ p {}

Selects every

element that are preceded by a

element. In other words,

The

would be selected, right?

And then there's the + selector:

div + p {}

Selects all

elements that are placed immediately after

elements. In other words,

Am I right to think these are equivalent, or am I missing something?

Answer

In your specific scenario, these two selectors are equivalent, however not in more general scenarios.

There is one important difference, the + combinator states:

The elements represented by the two sequences share the same parent in

the document tree and the element represented by the first sequence
immediately precedes the element represented by the second one.

Imagine this scenario:

And please don't confuse the W3C, a serious institution standardizing web technologies, with w3schools which is a rather bad source for information!