Html input with icon right

<div class="input-icon-wrap">
  <span class="input-icon">
    <span class="fa fa-user"></span>
      
    </span>
  <input type="text" class="input-with-icon" id="form-name">
</div>  	


// css
.input-icon-wrap {
  border: 1px solid #ddd;    
  display: flex;
  flex-direction: row;
}

.input-icon {
  background: #ddd;
}

.input-with-icon {
  border: none;
  flex: 1;
}

.input-icon, .input-with-icon {
  padding: 10px;
}

Source: codepen.io

Similar codes

2 votes132 views1 answer
Git pull one file
Html
1 vote119 views1 answer
How to edit an HTML file
Html
1 vote125 views1 answer
Refused to display 'https://www.youtube.com/' in a frame because it set 'X-Frame-Options' to 'sameorigin'.
Html
0 vote182 views1 answer
Apit teks Selamat Datang di Progate dengan tag <h1>.
Html
2 votes125 views1 answer
Show pdf in html
Html
0 vote125 views1 answer
This src jqery
Html
2 votes125 views1 answer
Boostrap 4 clear input
Html
0 vote129 views1 answer
Html content editable no newline
Html
0 vote138 views1 answer
Input type on click submit buttom show
Html
0 vote150 views1 answer
How to summon an entity with a tag
Html