add icon to input

1<!-- If using Bootstrap -->
2<!-- Icon can be put before or after input -->
3<div class="input-group mb-3">
4  <span class="input-group-text" id="basic-addon1">
5  	<!-- Icon or Text here -->
6  </span>
7  <input type="text" class="form-control" placeholder="Username" aria-label="Username" aria-describedby="basic-addon1">
8  <span class="input-group-text" id="basic-addon1">
9  	<!-- Icon or Text here -->
10  </span>
11</div>
12
13<!-- Pure Css & Html -->
14<!-- src: https://stackoverflow.com/a/40261155 -->
15<style type="text/css">
16  #input_container {
17    position:relative;
18    padding:0 0 0 20px;
19    margin:0 20px;
20    background:#ddd;
21    direction: rtl;
22    width: 200px;
23  }
24  #input {
25      height:20px;
26      margin:0;
27      padding-right: 30px;
28      width: 100%;
29  }
30  #input_img {
31      position:absolute;
32      bottom:2px;
33      right:5px;
34      width:24px;
35      height:24px;
36  }
37</style>
38<div id="input_container">
39    <input type="text" id="input" value>
40    <img src="https://cdn4.iconfinder.com/data/icons/36-slim-icons/87/calender.png" id="input_img">
41</div>