title: Auto focus is not working for input field
body: <p>When I Press Login button one popup is shown.</p>
  
  <p>In that popup I need default autofocus on Login Input field. Can I achieve that with HTML5/CSS only?</p>
  
  <p><a href="http://jsfiddle.net/Raghava0330/6f9ge64f/" rel="noreferrer">jsfiddle</a></p>
  
  <pre><code>&lt;div class="main"&gt;
      &lt;div class="panel"&gt; &lt;a href="#login_form" id="login_pop" onclick=""&gt;Log In&lt;/a&gt;
  
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;!-- popup form #1 --&gt; &lt;a href="#x" class="overlay" id="login_form"&gt;&lt;/a&gt;
  
  &lt;div class="popup"&gt;
       &lt;h2&gt;Welcome Guest!&lt;/h2&gt;
  
      &lt;p&gt;Please enter your login and password here&lt;/p&gt;
      &lt;div&gt;
          &lt;label for="login"&gt;Login&lt;/label&gt;
          &lt;input type="text" id="login" value="" autofocus /&gt;
      &lt;/div&gt;
      &lt;div&gt;
          &lt;label for="password"&gt;Password&lt;/label&gt;
          &lt;input type="password" id="password" value="" /&gt;
      &lt;/div&gt;
      &lt;input type="button" value="Log In" /&gt; &lt;a class="close" href="#close"&gt;&lt;/a&gt;
  
  &lt;/div&gt;
  </code></pre>