擬似クラスと擬似要素は組み合わせて使えるのか？

CSSにて擬似クラスと擬似要素を組み合わせて使う場合、
「疑似クラス＋疑似要素」
の組み合わせ順は機能します。

例 :hover::before

逆に、
「疑似要素＋疑似クラス」
の組み合わせ順は機能しません。

例 ::after:hover

デモページはこちら