Databases
StackOverflow2013
Postsdbo
POHow do I make it impossible to highlight text using CSS?
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POHow do I make it impossible to highlight text using CSS?
    text
    copied!<p>I am trying to make a website. I made a header using tables, and when you highlight it it looks tacky. </p> <pre><code>.topmenu::selection { background: rgba(255,79,79,0); /* Change highlight color */ } </code></pre> <p>I call it by using <code>&lt;div class="topmenu::selection"&gt;</code> in the PHP. Am I calling this code incorrectly?</p> <p>Thanks!</p> <p>EDIT: This didn't quite seem to work. I am working with expression engine if that makes any changes. here is my work so far: </p> <pre><code>&lt;meta http-equiv="Content-Type" content="text/html; charset={charset}" /&gt; &lt;link rel="shortcut icon" href="/Flame.ico" /&gt; &lt;title&gt;New Hope Christian College&lt;/title&gt; &lt;link rel="stylesheet" type="text/css" href="/nhcc-css/text.css" /&gt; &lt;center&gt; &lt;table width="960" border="0" div class="topmenu"&gt; .topmenu { FONT-SIZE: 12px; COLOR: #000000; FONT-FAMILY: Arial, Helvetica, sans-serif; } .topmenu::selection { background: transparent; } .topmenu::-moz-selection { background: transparent; } .topmenu a { color: #A71137; text-decoration: none; } a:hover { COLOR: #000000; text-decoration: none; } </code></pre> <p>Essentially, I have a table, I want the header (which is a table) to be "unselectable" and the rest of the body to be selectable. </p> <p>This one did it for me!</p> <p>It's possible in CSS3 user-select property:</p> <p>CSS</p> <pre><code>.element{ -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } </code></pre> <p>You can also add cursor:default; on the :hover peuso-element.</p> <p>Example with a table and a thead</p> <p><a href="http://jsfiddle.net/swAmt/2/" rel="nofollow">http://jsfiddle.net/swAmt/2/</a></p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload