CODEWITHSUNDEEP
htmlcss
Mousa Khaleel
Mousa Khaleel

Reputation: 73

IE 9 is making the input text field resizable, how to disable that and remove the border around it?

I added a text input field inside a contenteditable div in IE 9, but the input field is resizable and has a border around it, i tried to fix this with CSS but it is not working. Here's my code:

HTML:

<body>
<div id="wrapper">     
    <div id="input" style="border:1px solid black;height:100px;" tabindex="0" onfocus="divFocus();" onblur="divBlur();">
        <p id="text" contenteditable="true">
        <input type="text" id="textBox" size="3" onblur="keydown(32);" onkeypress="this.style.width = ((this.value.length + 1) * 8) + 'px';" 
       value="Anything" />
        </p>
    </div>
</div>
</body>

CSS:

    #textBox
{
    text-wrap:normal;
    font-family:arial;
    font-size:15px;
    border:none;
    resize:none;
    border:0; 
    border-color: transparent;
}
#textBox:focus 
{
    outline: none;
    outline-width: 0;
    outline-color: transparent;
}

Upvotes: 1

Views: 1032

Answers (1)

sajay
sajay

Reputation: 315

use 

resize:none

this will stop the input field from resizing

Upvotes: 2

Related Questions