Chachoo Aguirre
Chachoo Aguirre

Reputation: 484

unknown border in chrome input

I have a search input with a strange border. I've already tried removing the outline, shadow, :focus and :active styles and got no results.

This only happens on Chrome. On Firefox and Safari the border's not there.

Here's a screenshot - http://d.pr/i/yPNo - and here's the code I'm using - http://jsfiddle.net/3CDcV/

Upvotes: 2

Views: 658

Answers (1)

The Alpha
The Alpha

Reputation: 146191

Here you go

input[type="search"]{
    border-radius:4px;
    -webkit-border-radius: 4px;
    height:25px;
    width:150px;
    background:#181818;
    border:1px solid #0e0e0e;
    padding-left:5px;
    color:#666;
    font-size:10px;
    -webkit-box-shadow:  1px 1px 0px 1px #202020;
    box-shadow:  1px 1px 0px 1px #202020;
    margin-left:5px;
    margin-right:5px;

    -moz-appearance:none;
   -webkit-appearance:none;
}  ​

DEMO.

Upvotes: 3

Related Questions