How to set readonly property of textbox from css.

Question

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..

Answer 1

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

Answer 2

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).

Answer 3

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