How to prevent user copying text of a certain div using CSS?

Question

I know one can use the below CSS to disable user text selection.

   .unselectable{
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    }

But when I have the following html:

<p>selectable text 1</p>
<p class="unselectable">unselectable text</p>
<p>selectable text 2</p>

Users can still copy the unselectable text by selecting from the very top of the page (selectable text 1) to the very bottom of the page (selectable text 2). Any ways to prevent that? Thanks.

The code seems to work well for me. I tried to replicate your scenario and i am not able to select the unselectable text. — VSri58
– VSri58, Commented Nov 19, 2014 at 2:44
Could you provide your browser details or may be attach a screenshot of your issue with the text selected? — VSri58
– VSri58, Commented Nov 19, 2014 at 2:45
Actually I mean copying the text, not text selection. Not sure why I wrote this.. You can see on jsfiddle.net/gtb74zqj . When I select the whole result area and press Ctrl + C, I can copy all the three lines of the text. I am using Chrome on Windows Vista. — user2335065
– user2335065, Commented Nov 19, 2014 at 2:52

Sudhir Kaushik · Accepted Answer · 2017-01-07 10:07:25Z

3

Questions seems vague.

There is a difference between "Selection" and "Copying" on HTML pages.You can prevent "Selection" using CSS, but you can not prevent "Copying" using CSS. You need JS for that.

answered Jan 7, 2017 at 10:07

Sudhir Kaushik

1649 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Sudhir Kaushik Over a year ago

Check this for disabling text copy stackoverflow.com/questions/737022/…

Community · Accepted Answer · 2017-05-23 12:02:34Z

0

You just give it a div wrapper and define the id selector to do what you want Correct way to do a css wrapper

edited May 23, 2017 at 12:02

CommunityBot

11 silver badge

answered Nov 19, 2014 at 2:48

boobie

962 silver badges12 bronze badges

Collectives™ on Stack Overflow

How to prevent user copying text of a certain div using CSS?

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related