title: CSS + HTML Header with login form
body: <p><img src="https://i.stack.imgur.com/wJJSs.jpg" alt="the header"></p>
  
  <p>I can't figure myself best way to do this header of site with login form on right
  Light grey pattern is only background for header (85px tall container), body background white </p>
  
  <p>I did the dark line with </p>
  
  <pre><code>html {
  border-top:7px solid #505559;
  }
  </code></pre>
  
  <p>i centered the container like this</p>
  
  <pre><code>#header_container {
      margin:0 auto;
      width:970px;
  }
  </code></pre>
  
  <p>Size of the logopic 197x45 and size of submit button 79x28</p>
  
  <p>The form elements should be attached to right side of container</p>
  
  <p>How would you align the submit button with bottom of white textfield</p>
  
  <p>I would also want to see how you would place the html form element so i didn't add my own fail code</p>
  
  <p>------- html code</p>
  
  <pre><code>&lt;header&gt;
  &lt;div id="header_holder"&gt;
  &lt;h1&gt;logopic&lt;/h1&gt;
  &lt;div id="login"&gt;
  &lt;form action="&lt;?php echo $_SERVER['PHP_SELF']; ?&gt;" method="post"&gt;
   &lt;div id="username"&gt;
    &lt;label for="username"&gt;Username&lt;/label&gt;
    &lt;input type="text" name="username" maxlength="60"&gt;
   &lt;/div&gt;
  
  &lt;div id="password"&gt;
   &lt;label for="pass"&gt;Password&lt;/label&gt;
   &lt;input type="password" name="pass" maxlength="10"&gt;
   &lt;input type="image" src="img/kirjaudu.png" alt="Submit button"&gt;
  &lt;/div&gt;
  
  &lt;/form&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  &lt;/header&gt;
  </code></pre>