Input text very small when hovering on autofill suggestion

Question

In Google Chrome on MacOS (Version 75.0.3770.142) when I hover over an autofill suggestion the font size in the input becomes very small (also the font family changes) but after choosing the suggestion it goes back to the normal size.

What might be causing this behaviour?

Answer 1

There is a solution:

input:-webkit-autofill::first-line {font-size: 16px}

Answer 2

Here is working solution that worked for me in 2021 for Chrome not to change font size on autocomplete suggest hover:

input#email {
  font-size: 2rem;
  color: blue;
}

input:-webkit-autofill::first-line {
      color: red;
      font-size: 2rem;
}

<input id="email"></input>

Also I noticed that for some reason display: flex conflicts with that code, take a look:

input#email {
  font-size: 2rem;
  color: blue;
  display: flex;
}

input:-webkit-autofill::first-line {
      color: red;
      font-size: 2rem; 
}

<input id="email"></input>

Answer 3

input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus { // put your old style here }