Thursday, December 7, 2023
HomeSoftware EngineeringHow you can disable textual content choice highlighting in CSS

How you can disable textual content choice highlighting in CSS


If you want to disable the textual content choice highlighting that’s enabled by default on all browsers, then you are able to do this:

user-select: none;

If you’re involved about cross-browser assist, then use this class:

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Previous variations of Firefox */
        -ms-user-select: none; /* Web Explorer/Edge */
            user-select: none; /* Non-prefixed model, at the moment
                                  supported by Chrome, Edge, Opera and Firefox */
}

You possibly can then use it like this:

<p>
  Selectable textual content.
</p>
<p class="noselect">
  Unselectable textual content.
</p>
RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

Most Popular

Recent Comments