CODEWITHSUNDEEP
javascriptjquerycss
streetlight
streetlight

Reputation: 5968

Removing Browser Readonly Styles

I am trying to disable user text input in a text field, and am using the readonly="true" attribute on the input itself.

However, I don't want it too look different then a default input field. I'm am trying to write a solution that will not make me go in and write CSS for it, as browsers may change their styling and make this miserable.

Is there any way to just remove the browsers readonly style?

Here's a screenshot I'm talking about. The one on the right is readonly, but I want it to look the same as the one on the left.This is only in Chrome. All browsers will handle it differently.

Upvotes: 0

Views: 211

Answers (1)

Jukka K. Korpela
Jukka K. Korpela

Reputation: 201538

Browser styles are by definition browser-specific, so any solution would be browser-specific. You would need to study the browser defaults (from documentation or via experimentation) and to serve different styles to different browsers. A lot of work, and I don’t quite see what the potential benefit might be. It would in general be bad for usability to remove the distinction between normal and disabled fields.

You can set the style explicitly to be the same for normal and disabled fields, but then you won’t get browser defaults.

Upvotes: 1

Related Questions