Google Places Autocomplete 2-line styling CSS [SOLVED]

For almost a decade Google Places Autocomplete formatting has been a thorn in the bottom of every developer, so is mine. Here is how I solved it

formatting Google Map Places Autocomplete in two lines bcoz the entire address is not visible properly to elderly people and visually impaired. Here is the best practice

On pac-item-query &&& pac-item apply css DISPLAY:BLOCK and FONT-SIZE:20PX

.pac-item { font-size: 18px; /* resize */ color: red; font-weight: bold; /* font attribute */ font-family: Arial, Helvetica, sans-serif; display:block; /* display address in 2-LINE */ } .pac-item-query { font-size: 18px; /* resize */ color: #000; font-weight: bold; /* font attribute */ font-family: Arial, Helvetica, sans-serif; display:block; /* display address in 2-LINE */ } .pac-icon, .pac-icon-marker { display: none; }

Google Autocomplete Dropdown Hide Behind Form

A common shit every developer goes thru. just place the code below on your page or stylesheet. REST IS ASSURED <STYLE> .pac-container { z-index: 105154444444444444444444444444 !important; } </STYLE>