How to keep text from being selected

Question

I've googled and searched around here on SO, but haven't found an answer to this question.

I know that this can be done using user-select:none with CSS, but as you can see, this is not a standard property, and I'm trying to find an alternative.

NOTE: I don't care if the users can get the text. It's for the design of the site, not to keep users from copy/paste.

I know that this CAN be done with JS. I do not know it it's difficult, or how to do it, but if you type HTML or JS code into the HTMLObfuscator, there is an option on the left that can disable text selection. Is this easy to implement into certain parts of my site? Or is it rather complicated (like in the obfuscator)?

Thank you for all your help . . .

Answer 1

Use the CSS property pointer-events: none;. It will keep the mouse from having any effect on the text at all, so don't use this for a button or anything like that.

Answer 2

CSS way:

element:before {
    content:'whatever';
};

before and after make it part of the element.