Icon next to input

Asked

Viewed 1,417 times

3

I want to create a page to run on the Gatekeeper portal, and I really liked the inputs of the login page of the site King Debrid, but it uses Bootstrap. Wanted the same effect, but without the use of Bootstrap.

inserir a descrição da imagem aqui

css font-awesome

  • What’s your question? You tried to do it somehow?

  • Welcome to SOPT. Would like to [Edit] your post and add the code you are using, so we can analyze and suggest a change. Thank you.

1 answer

3


div{
  width: 400px;
  background-color: #E7E7E7;
  border:1px solid #C7C7C7;
}

i{
  background: url(http://findicons.com/files/icons/2171/kiwi/32/admin.png) no-repeat center center;
  background-size: 20px;
  width: 50px;
  height: 32px;
  display: inline-block;
  vertical-align: middle;
  box-sizing: border-box;
}

input[type="text"]{
  line-height: 32px;
  display: inline-block;
  vertical-align: middle;
  width: 343px;
  border: none;
}
<div>
  <i></i>
  <input type="text">
</div>

Browser other questions tagged css font-awesome

You are not signed in. Login or sign up in order to post.