CODEWITHSUNDEEP
htmlcss
Tree
Tree

Reputation: 10342

Transparent, borderless text input

How can I remove the border around an <input type="text"> and make its background transparent?

Upvotes: 32

Views: 94674

Answers (4)

Sachin
Sachin

Reputation: 3540

border: none transparent;
outline: none;

This will not only remove the border around the input field but also the orange highlight when the input is in focus.

Upvotes: 23

SLaks
SLaks

Reputation: 887453

Like this:

input {
    border: none;
    background: transparent;
}

Upvotes: 19

Haim Evgi
Haim Evgi

Reputation: 125496

Try this:

border: none;
border-color: transparent;

Upvotes: 55

user1032531
user1032531

Reputation: 26281

Better late than never:

input {border-style:none;}

Upvotes: 1

Related Questions