title: Bad behavior of floating-labels when autocomplete
body: <p>I've using the <a href="https://getbootstrap.com/docs/4.3/examples/floating-labels/" rel="noreferrer">Floating labels</a> example from <a href="https://getbootstrap.com/docs/4.3" rel="noreferrer">Bootstrap 4.3</a>.</p>
  
  <p>If the browser has already credentials on the autocompletement, the layout of <code>&lt;input&gt;</code> will breaks.</p>
  
  <p>The animation (and the size &amp; margin properties) of floating labels will only start, if the window/document has an focus.</p>
  
  <p>How i can prevent these problem?</p>
  
  <p>I've found the <code>CSS</code> propertie <code>:-webkit-autofill</code>, or try to focus the first <code>input</code> field, but the problem will be not solved.</p>
  
  <p><strong>Preview:</strong></p>
  
  <p><a href="https://i.stack.imgur.com/UcD40.png" rel="noreferrer"><img src="https://i.stack.imgur.com/UcD40.png" alt="Preview"></a></p>