title: Problems with DIV Tags in Html/Css
body: <p>I've been trying to create a website but the <code>div</code> tags aren't seeming to go as planned. For the banner <code>div</code>, logo <code>div</code> and main navigation system <code>div</code>, they are perfectly in line where I want them, but when I try to position the subnavbar and the search bar, they go in a weird position? I can't see what I've done wrong with my code, it all seems okay.</p>
  
  <p>Basically for the subnav bar I want it underneath the <code>logo div</code>, and then for the <code>search div</code>, I want this slightly under the main navigation system.
  The code is below to make things easier, Thanks in advance!</p>
  
  <p><a href="http://jsfiddle.net/xyDt2/" rel="nofollow">http://jsfiddle.net/xyDt2/</a></p>
  
  <p>I believe here is the code I am having problems with:</p>
  
  <p>html</p>
  
  <pre><code>&lt;div id="SubNavBar"&gt;
  &lt;a id="LaptopsOver" href="#" class="left" &gt; &lt;/a&gt;
  &lt;a id="NetbooksOver" href="#" class="left" &gt;&lt;/a&gt;
  &lt;a id="TabletsOver" href="#" class="left" &gt;&lt;/a&gt;
  &lt;a id="eRaaderOver" href="#" class="left" &gt;&lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>css </p>
  
  <pre><code>#SubNavBar {
  border: 3px solid #000;
  margin-right: auto;
  margin-left: auto;
  height: 209px;
  width: 100px;
  left: auto;
  right: auto;
  }
  </code></pre>