Skip to content Skip to sidebar Skip to footer

Padding A Text Input In Ie... Possible?

I have a text input with a search buton absolute positioned over it... to make space for the button I used some padding to keep the text from going under the button, which is fine,

Solution 1:

try using line-height

Solution 2:

I had this issue also i solved it by adding the following line

input 
{
    overflow:visible;
    padding:5px;
}

hope this helps? Let me know.

Solution 3:

Try border-right instead of padding-right. This worked for me.

Solution 4:

Make your input transparent and place styles inside a container div:

http://jsfiddle.net/LRWWH/211/

HTML

 <div class="input-container">
 <inputtype="text"class="input-transparent"name="fullname"></div>

CSS

.input-container {
    background:red;
    overflow:hidden;
    height: 26px;
    margin-top:3px;        
    padding:6px10px0px;
    width: 200px;
  }

 .input-transparent {
    background-color:transparent;
    border:none;
    overflow:hidden;        
    color:#FFFFF;
    width: 200px;
    outline:none;
  }

Solution 5:

There is a css only fix for it

div.searchinput[type="text"] {
    width: 110px;
    margin: 0;
    background-position: 0px -7px;
    text-indent:0;
    padding:015px015px;
}
/*ie9*/div.searchinput[type="text"] {
    border-left: 25px solid transparent;
}
/*ie8*/div.searchinput[type="text"] {
    border-left: 25px solid transparent;
    background-position-x: -16px;
    padding-left: 0px;
    line-height: 2.5em;
}

Thanks Muhammad Atif Chughtai

Post a Comment for "Padding A Text Input In Ie... Possible?"