Я хочу создать форму для ввода с иконкой внутри нее.когда я нажимаю на этот элемент формы (: focus), этот значок исчезает, и я хочу, чтобы значок был виден постоянно.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
<style>
* {
box-sizing: border-box;
padding: 0;
margin: 0;
}
html,body {height: 100%;}
input {
width: 400px ;
height: 4em;
border: none ;
padding: 1em 0 1em 2em ;
color: black;
background: url('https://www.bluebadgeinsurance.com.au/wp-content/uploads/multi-user-icon.png') left center no-repeat ;
background-size: 30px 30px ;
}
</style>
</head>
<body>
<form name="myForm">
<input type="text" name="username" placeholder="username">
</form>
<script>
</script>
</body>
</html>