Remove borders for text input on bootstrap 3

Question

I'm trying to remove top, right and left borders for text input fields, using bootstrap 3. My selector is:

input[type="text"] {
border-top: 0;
border-right: 0;
border-left: 0;

}

It's still showing (in chrome) a slight thin line.

I'm not sure how to get that ghost line to disappear

Answer 1

You did remove the border from top left and right. That "ghost line" you see, it is the inset shadow. You can remove that as well

input[type="text"] {
     border-top: 0;
     border-right: 0;
     border-left: 0;

     -webkit-box-shadow: none;
     box-shadow: none;
}

and if you want to remove that when a user "focuses" the field

input[type="text"]:focus {
     -webkit-box-shadow: none;
     box-shadow: none;
}

Answer 2

Write this in your css file.

input {
    border: none;
}

If it is not working please share your html code.

Answer 3

If your form uses tags <fieldset>, try to remove their borders too:

fieldset {  
  border: 0;
}