Fixing semantics for CSS pseudo element selectors

Pseudo elements and pseudo selectors in CSS can be differentiated by using different number of : (colon), as suggested in the related CSS3 specification module.

Regular expression for finding possible usages of single colons, such as :after and :before:

([^:])(:{1})(\bafter|before\b)

Replace with, thus using the three matched values with inserted additional colon:

$1:$2$3

The regular expression could be extended by adding all the pseudo elements defined in the specification, such as ::first-line and ::first-letter.

Essentially making this change will drop the support for IE8, as can be seen via browser support table at Mozilla Developer site.

More about regular expressions, learn in 55 minutes.