In my page i have made an entire div unselectable, with the help of this css (which i got from stackoverflow it self)
.unselectable {
-moz-user-select: -moz-none;
-khtml-user-select: none;
-webkit-user-select: none;
/*
Introduced in IE 10.
See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/
*/
-ms-user-select: none;
user-select: none;
}
Now i got an h2 tag inside this unselectable div.And i want that h2 to become selectable.Is there any way to achieve this easly.
I have forgot some thing in my question . i got three h2 in my code an i need specific one to be selectable so i added a class to this h2 and tried some thing like this .unselectable:not(.class-of-h2) (which i got from below answers).but its not working
Use for your h2 element
.unselectable h2{
-moz-user-select: text;
-khtml-user-select: text;
-webkit-user-select: text;
-ms-user-select: text;
user-select: text;
}
See demo
Just add the below CSS
.unselectable h2 {
-moz-user-select: text;
-khtml-user-select: auto;
-webkit-user-select: auto ;
-ms-user-select: auto;
user-select: auto;
}
See the demo
you can use
.unselectable:not(h2:nth-child(2)) {
//your data
}
not can exclude the element from your list of selector
this can make your whole div unselectable except h2 element.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With