title: How to left align peoperly my logo
body: <p>I have a page and its header navihation is properly inherit therefore its coming to the center.</p>
  
  <p>But the Logo which is not coming to proper left, its going to left side of the page.</p>
  
  <p><img src="https://i.stack.imgur.com/vAaIL.jpg" alt="Screenshot of the output"></p>
  
  <p>HTML</p>
  
  <pre><code>&lt;title&gt;VRBO&lt;/title&gt;
  &lt;link href="style.css" rel="stylesheet" type="text/css" /&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
  &lt;div id="main_layout"&gt;
  &lt;div id="header_menu"&gt;
  &lt;center&gt;
  &lt;a href="#"&gt;&lt;img src="images/nav_header.png" width="900" height="43" /&gt;&lt;/a&gt;
  &lt;/center&gt;
  &lt;/div&gt;
  &lt;div id="header_logo"&gt;
  &lt;img src="images/logo.png"  class="logoImage" width="96" height="96" /&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>CSS</p>
  
  <pre><code>html, body, div, span, applet, object, iframe,
  h1, h2, h3, h4, h5, h6, p, blockquote, pre,
  a, abbr, acronym, address, big, cite, code,
  del, dfn, em, img, ins, kbd, q, s, samp,
  small, strike, strong, sub, sup, tt, var,
  b, u, i, center,
  dl, dt, dd, ol, ul, li,
  fieldset, form, label, legend,
  table, caption, tbody, tfoot, thead, tr, th, td,
  article, aside, canvas, details, embed, 
  figure, figcaption, footer, header, hgroup, 
  menu, nav, output, ruby, section, summary,
  time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
  }
  article, aside, details, figcaption, figure, 
  footer, header, hgroup, menu, nav, section {
  display: block;
  }
  body {
  line-height: 1;
  }
  ol, ul {
  list-style: none;
  }
  blockquote, q {
  quotes: none;
  }
  blockquote:before, blockquote:after,
  q:before, q:after {
  content: '';
  content: none;
  }
  table {
  border-collapse: collapse;
  border-spacing: 0;
  }
  a {text-decoration:none;}
  body {
  }
  h1,h2,h3,h4,h5 {
  font-family:Verdana, Geneva, sans-serif; font-weight:normal;
  line-height:100%;
  margin-top: 0;
  }
  #main_layout {
  background-image: url(images/vrbo_bg.jpg);
  background-repeat: no-repeat;
  background-position: center top; 
  height: auto;
  min-height: 100%;
  min-width: 900px;
  left: 0px;
  top: 0px;
  position: fixed;
  width: 100%;
  }
  #header_menu {
  overflow:hidden;
  width: 100%;
  }
  #header_menu img {
  float:inherit;
  margin:0px;
  }
  #header_logo  {
  overflow: hidden;
  width: 100%;
  float:inherit;
  margin:0px;
  }
  #header_logo img.logoImage {
  float: left;
  margin-left: 10px;
  } 
  </code></pre>
  
  <p>Also could you please let me know what I did wrong ?</p>
  
  <p>Thanks!!!</p>