Wrong background on custom input["text"] CSS

Question

I'm trying to style a form input["text"] field, but I'm getting this white border / background all around, and I don't know how to get rid of it.

Can anyone help me?

.my-form-login input[type="text"] {
    background-image: url('../images/text-input.png');
    background-repeat: no-repeat;
    outline: none;
    width: 180px;
    height: 30px;
    border: none;
    padding: 5px;
}

Answer 1

A combination of border:0px + setting the background color solved it

Althought would be great to set it to transparent...

Thanks everyone.

.my-form-login input[type="text"] {
    background-image: url('../images/text-input.png');
    background-repeat: no-repeat;
    outline: none;
    width: 180px;
    height: 30px;
    padding: 0px;
    background-color: #444;
    border: 0px;
}

Answer 2

Use background-color:[background color of parent tag];