Esto es lo que hice:
Y esto es lo que quiero:
Ambas barras de búsqueda están en estados al hacer clic. No puedo encontrar una manera de usar bootstrap, CSS, JS,
¿Cómo puedo implementar esta función?
Código:
.loc-icon{ background-color: white; border: none; border-radius: 15px; padding: 15px } .loc-input{ border: none; padding: 15px; border-radius: 15px; } .loc-submit{ background-color: white; border: none; border-radius: 15px; padding-right: 1rem; } <div class="input-group mb-3 loc-bar"> <span class="input-group-text loc-icon" id="inputGroup-sizing-default"><img src="Images/place.png" alt=""></span> <!-- location icon --> <input type="text" class="form-control loc-input" aria-describedby="inputGroup-sizing-default" placeholder="Enter your location"> <button class="loc-submit " type="submit" name="button"><a href="/"><img src="Images/right-arrow.png" alt=""></a></button> </div>¡Por favor ayúdame!
Gracias Gente increíble..