title: Centering a Logo across multiple resolutions
body: <p>I have a logo that i am trying to center on a page. Dead center from left to right. The problem that i have been facing is when i view it on different monitor sizes/resolutions it never lines up to be centered. I get it right on one resolution/size and then when i go to work on my smaller monitor it doesn't line up.  Does this need to be accomplished with multiple stylesheets or a dynamic theme?  I am coding the site in ASP.NET and have themes set up. This can be changed if needed. </p>
  
  <pre><code>&lt;body&gt;
  &lt;div class="wrap_1"&gt;
      &lt;form id="form1"  runat="server"&gt;
      &lt;!-- LOGO WRAP STARTS HERE--&gt;
  
          &lt;asp:Image SkinID="DefaultLogo" runat="server"/&gt;
  
    &lt;div style="background-color: #c5e8ea;"  &gt;
    &lt;!-- TITLE WRAP STARTS HERE--&gt;
      &lt;div class="wrap"&gt;
  &lt;div&gt;
      &lt;h1 style="padding-left:2em;"&gt;BLAH BLAH BLAH &lt;/h1&gt;
      &lt;h2 style="padding-left:5em;"&gt;BLAH BLAH BLAH &lt;/h2&gt;
      &lt;div&gt;
   &lt;!--CONTROLS --&gt;
   &lt;ul id="home-menu"&gt;
      &lt;li&gt;
          &lt;asp:Button SkinID="Button1" runat="server" PostBackUrl="~/Reinstall.aspx"/&gt;
      &lt;/li&gt;
      &lt;li&gt;
          &lt;asp:Button SkinID="Button2" runat="server" PostBackUrl="~/Registration.aspx" /&gt;
      &lt;/li&gt;
  &lt;/ul&gt;
  
  
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;/div&gt;
    &lt;/div&gt;
      &lt;/form&gt;
  </code></pre>
  
  <p>CSS</p>
  
  <pre><code>.DefaultLogo {
       margin: auto auto;
  }
  
  .wrap_1 {
      margin: 0 auto;
  }
  
  .wrap {
      margin: auto auto;
  }  
  </code></pre>