I'm experimenting with using the Font Awesome Map Marker in a Google Autocomplete Input. My aim is to position the Map Marker to the left of the placeholder text, apply color only to the map marker, and ensure that it remains visible even while the user is typing. I have attempted the following approach:
<span class="google-address-bar"><input #pacinput id="pac-input" class="form-control" type="text" placeholder=" Enter Your Street Address">
</span>along with :
#pac-input {
font-family: Fira-Sans, FontAwesome, Serif;
background-color: #fff;
width: 400px;
height: 45px;
font-size: 15px;
font-weight: 300;
text-overflow: ellipsis;
}However, this solution does not allow me to add color specifically to the Map Maker, and when the input becomes dirty, the placeholder disappears. Has anyone found a way to achieve this?