How to set readonly property of textbox from css

i create css code like 开发者_运维问答

.inputHide {
    font-size       : 100px;
    width           : 100px;
    height          : 100px;
    border          : none;
    background      : transparent;
    readonly        : true;
}

But it does not work. Although if i use font-size of 1px then by using tab i can access that textbox & can change it's value.

Is there any way to make textbox readonly just using css..

For people coming to this answer now. You can do this now with

pointer-events: none;

You don't set the behaviour of controls via CSS, only their styling - if you need to make it read-only, flag it as such on the actual control

I agree with rowland but you can set it uneditable with:

.inputHide {
    display: none;
}

although this takes it out of the flow (so there is a noticable movement of elements to fill the void your textbox left).

This method makes it completely invisible and uneditable... not just visible and greyed out (like HTML "disabled" or "readonly" attributes would do).

Readonly is not a STYLE attribute. So you can't set with CSS (cascading STYLE sheet).

$("select").selectize({
        onInitialize: function() {
            this.$control_input.attr("readonly","readonly");

        }
    });

css cannot be used for making an input readonly. You can use jquery or simple javascript to change the prperty of the fields.