title: HTML required input field bubble off position (Google Chrome)?
body: <p><strong>Edit:</strong>
  I set up a clean fiddle with minimum of HTML and <strong>no</strong> CSS:</p>
  
  <pre><code>&lt;form&gt;
  &lt;input type="text" required /&gt;
  &lt;input type="submit" required /&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>Result:</p>
  
  <p><a href="https://i.stack.imgur.com/E6xJq.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/E6xJq.png" alt="enter image description here"></a></p>
  
  <p>Link:
  <a href="https://jsfiddle.net/d1d9g7sw/" rel="nofollow noreferrer">https://jsfiddle.net/d1d9g7sw/</a></p>
  
  <p>This result is reflected in my own test template, and I want that required message bubble aligned left. Looks like, this is only happening on Google Chrome. My current version (up to date): <em>Version 59.0.3071.115 (Offizieller Build) (64-Bit)</em></p>