[SOLUCIONADO] Este diseño de ¨buscar¨

[alexkurban]

Hola a todos, estoy armando una web para meterla en mi portafolio y estoy intentando hacer este div de buscar, alguien sabria como hacerlo?

[MaNuX0218]

Que div? No se ve nada xD

Saludos.

[alexkurban]

vaya fallo xD se me olvido linkearlo, aqui lo tienes

http://prntscr.com/7s56gz

[AngelKrak]

ahi esta amig@, asi es como lo quieres no?



HTML:

Código HTML:

<input type="search" placeholder="Busca tu Archivo" id="Buscador" />
<!-- By AngelKrak -->
 

CSS:

Código CSS:

#Buscador {
  background: url(https://cdn0.iconfinder.com/data/icons/slim-square-icons-basics/100/basics-19-32.png) no-repeat 0px 5px;
  background-size: 24px;
  width: 500px;
  border: transparent;
  border-bottom: solid 1px #ccc;
  padding: 10px 10px 10px 30px;
  outline: none;
}
 

Demo:
http://codepen.io/AngelKrak/pen/xGzGmR

[alexkurban]

Es perfecto! muchas gracias