css search icon inside input

Solutions on MaxInterview for css search icon inside input by the best coders in the world

showing results for - "css search icon inside input"
Emily
15 Apr 2017
1<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
2
3<style>
4#input_group{
5  position:relative;
6  width:fit-content;
7}
8
9#label{
10  position:absolute;
11  right:5px;
12  top:50%;
13  transform:translate(0,-50%)
14}
15
16#input{
17  padding-right:20px;
18}
19</style>
20
21<div id='input_group'>
22  <label id='label' for="input"><i class="fa fa-search"></i></label>
23  <input id='input' type="text">
24</div>