Selectable input fields and textareas but no other content selectable in Firefox?
Asked Answered
F

2

6

I need to prevent users from selecting elements in my web app UI, except for text in input fields and textareas. For Firefox, the technique seems to be to use this css:

* { -moz-user-select: none; }

And that works well enough (tested Firefox 3.5.2), except that you cannot then select within input fields or textareas.

I tried dividing it into

div,td,span,img { -moz-user-select: none; }
input,textarea { -moz-user-select: text; }

however, if the input field is inside of a div, td, or span, it is not selectable. It seems that the -moz-user-select property is applied to all children as well, no matter if those children override the setting. Does anyone know a way around this aside from setting this at a far more granular (and annoying) level for specific elements?

NOTE this is not for security purposes. I am fine having users view source or advanced users turning this off. But for web UI's with drag-and-drop functionality, or just those that are supposed to behave like an application in general rather than like a document, it is really weird to be able to accidentally select text. And it happens often for most users.

Fungus answered 8/9, 2009 at 20:31 Comment(0)
E
12
* { -moz-user-select: -moz-none; }
input,textarea { -moz-user-select: text; }
Eduardo answered 24/3, 2011 at 23:24 Comment(1)
ah crap, I just realized I had "none" not "-moz-none". Awarding you the bounty I just assigned as soon as I'm allowed to!!Fungus
O
1

You are fighting a lost cause. If I really want to select text from your page, or get it in some way, I will.

However, on to your question. Try adding !important to the end, so it looks like this:

div,td,span,img { -moz-user-select: none; }
input,textarea { -moz-user-select: text !important; }
Outnumber answered 8/9, 2009 at 20:35 Comment(2)
It is not for security purposes and I don't care if the user views source or anything. It is because for some reason people keep accidentally selecting stuff and it is goofy because this is a Application and in general selecting ui elements ("buttons" formed of composite html elements for instance) feels clunky...Fungus
..oh, and more importantly, !important didn't seem to help, I did try that, should have mentioned! thank you thoughFungus

© 2022 - 2024 — McMap. All rights reserved.