title: what should I do with css top value differences in chrome and firefox?
body: <p>The css top or margin-top values in chrome is so different with firefox and opera,what should I do? For example in chrome when I put (top:0px;) for (.slide_content) my menu is in its right place,but in firefox I have to put (top:-80px;).</p>
  
  <p>What should I do?please help;Thanks in advance.</p>
  
  <p>and also firebug doesn't have any errors. Sorry I couldn't post a jsfiddle link because the site contains lots of pictures and I really wanted to post pictures so that you can understand what I mean better,I tried but I needed 10 reputation but I have only 8,but this is my code:
   css:</p>
  
  <pre><code>    .tabbed_content {
          background-image:url('images/ct.png');
          width: 620px;
               height:62px;       
                   }
  
      .tabs {
          height: 62px;
          position: relative;
         /* top: 0px;
          left: 0px;
          width: 313px;*/
      }
  
      .tabs .moving_bg {
          background-color:#7F822A;
          -webkit-border-top-left-radius: 15px;
      -webkit-border-top-right-radius: 15px;
      -moz-border-radius-topleft: 15px;
      -moz-border-radius-topright: 15px;
      border-top-left-radius: 15px;
      border-top-right-radius: 15px;
          position: absolute;
          width: 125px;
          z-index: 190;
          left: 0;
          padding-bottom: 29px;
          background-position: left bottom;
          background-repeat: no-repeat;
                       top: 3px;
                       height: 15px;
                       padding-left: 15px;
                       padding-right: 15px;
                       padding-top: 15px;
                   }
  
      .tabs .tab_item {
          display: block;
          float: left;
          padding: 15px;
          width: 125px;
          color: #ffffff;
          text-align: center;
          z-index: 200;
          position: relative;
          cursor: pointer;top:-130px;
      }
  
      .tabbed_content .slide_content {
          overflow: hidden;
          background-image: url('images/bkg.png');
          padding: 20px 0 20px 20px;
          position: relative;
          top:0px;     /*THE PROBLEM IS HERE*/
  
      }
      .tabbed_content
      {
       width:310px;
      -webkit-border-top-left-radius: 15px;
      -webkit-border-top-right-radius: 20px;
      -moz-border-radius-topleft: 15px;
      -moz-border-radius-topright: 20px;
      border-top-left-radius: 15px;
      border-top-right-radius: 20px;
       margin-left:15px;
      }
      .slide_content {width:940px;height:380px;}
      .tabslider {
          width: 5000px;
      }
  
      .tabslider div {
          float: left;
          width: 560px;
          margin: 0px;
          padding: 0px;
          margin-right: 40px;width:900px;
      }
   a.ma:hover {text-decoration: underline;}
       a.ma{text-decoration:none; color:White;margin-left:650px;}
  
        #menu
          {
  
   position:relative;
  
              z-index:1;
              bottom: -50px;
              left:-175px;
              width: 1016px;
          }
  
  #menu ul {
  
              z-index:9999;
  
              width: 866px;
              margin-left: 150px;
          }
          #menu ul li{height:400px;float:left;list-style:none;z-index:9999;
  
  
          }
          #menu li a{display:block;height:63px;z-index:9999;
  
  font-size:20px;padding-top:90px;text-align:center;text-decoration:none;text-transform:uppercase;color:white;
              margin-left: 0px;
              }
              #menu li a:hover, #menu #menu_active a{}
  .nav1 {background:url('images/menu1.gif')  center 35px  no-repeat    }
  .nav2 {background:url('images/menu4.gif') center 35px no-repeat}
  .nav3 {background:url('images/menu5.gif') center 35px no-repeat}
  .nav4 {background:url('images/abus.gif') center 0px no-repeat}
  
  .nav1:hover, .nav1#active {background:url('images/menu1_active.gif') center 31px no-repeat #001527}
  .nav2:hover, .nav2#active {background:url('images/menu4_active.gif') center 31px no-repeat #001527}
  .nav3:hover, .nav3#active {background:url('images/menu5_active.gif') center 31px no-repeat #001527}
  
  .wrapper {overflow:hidden;float:right; height: 450px; margin-left: 63px;margin-right:0px; width: 941px;
  position: relative; 
      z-index: 2;
              top: 0px;
              left: -32px;
          }
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div style="background:url('images/toolbar2.png') no-repeat center top; height: 265px; width: 1013px;position:relative;"&gt;
      &lt;div class="wrapper"&gt; 
      &lt;br /&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;
      &amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;
      &amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;
      &lt;asp:Label ID="Label3" runat="server" Font-Bold="True" Font-Names="Andalus" 
          Font-Size="XX-Large" ForeColor="White" Text="Welcome To Saray Ceram"&gt;&lt;/asp:Label&gt;
  
  
                              &lt;br /&gt;
  
                              &amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;
  
  
                                  &lt;div style="height: 26px;margin-top:-70px; "&gt;
                                   &lt;a class="ma"  href="#"&gt;Site Map&lt;/a&gt;
  
                                      &lt;asp:TextBox ID="TextBox1" runat="server" 
                                          style="Width:149px;margin-right:2px; margin-left: 650px;"&gt;&lt;/asp:TextBox&gt;
                                      &lt;div style="width: 27px; height: 27px; background-image:url('images/s.png') ;position:relative; bottom:29px; left: 810px;" onclick="" &gt;&lt;/div&gt;    
  
  
  
  
                      &lt;/div&gt;
      &lt;div id="menu"  &gt; 
     &lt;ul&gt;
                          &lt;li class="nav1" style="margin-left:50px;height: 154px"&gt;&lt;a href="#" style="width:201px"&gt;&amp;nbsp;&amp;nbsp;Home&lt;/a&gt;&lt;/li&gt; 
  
                          &lt;li class="nav4" style="width:201px; height: 154px; margin-left: 0px;"&gt;&lt;a href="#" style="width:200px"&gt;&lt;/a&gt;&lt;/li&gt;
  
                          &lt;li class="nav3" style="width:200px; height: 154px;margin-left: 0px;"&gt;&lt;a href="#" style="width:200px"&gt;Contact Us&lt;/a&gt;&lt;/li&gt;
                              &lt;li class="nav2" style="width:201px; height: 154px;margin-left: 0px;"&gt;&lt;a href="#" style="width:200px"&gt;Products&lt;/a&gt;&lt;/li&gt;      
  
                           &lt;/ul&gt;
                          &lt;/div&gt;
                          &lt;/div&gt;
  
  
      &lt;/div&gt;
  &lt;div style=" background-image:url('images/bg_top2.jpg'); height: 600px; width: 990px; margin-left:0px;margin-right:0px"&gt; 
      &lt;br /&gt;
      &lt;br /&gt;
          &lt;div class='tabbed_content'&gt; 
                      &lt;div class='tabs'&gt; 
                          &lt;div class='moving_bg'&gt; 
                              &amp;nbsp;
                          &lt;/div&gt; 
                          &lt;span class='tab_item'&gt; 
                              Wall Tale
                          &lt;/span&gt; 
                          &lt;span class='tab_item'&gt; 
                              Floor Tale
                          &lt;/span&gt; 
  
                      &lt;/div&gt; 
  
                      &lt;div class='slide_content'&gt;                     
                          &lt;div class='tabslider'&gt; 
                              &lt;div&gt; 
  
                                                 sth comes here
                              &lt;/div&gt; 
                              &lt;div  &gt; 
                                                         and here
                              &lt;/div&gt; 
  
                          &lt;/div&gt; 
  
                      &lt;/div&gt;
  
                      &lt;/div&gt;
  
       &lt;br /&gt; 
       &lt;br /&gt;
  
  &lt;div  style=" background-image:url('images/bg_bot.jpg');width:988px;height:105px;margin-top:400px;" &gt;
      &lt;br /&gt;
  &amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;
  &amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;
      &lt;asp:Label ID="Label2" runat="server" Font-Bold="True" Font-Names="Andalus" 
          Font-Size="Large" ForeColor="White" Text="Copy Right © 2013 For Saray Ceram"&gt;&lt;/asp:Label&gt;
  
      &lt;/div&gt;
  </code></pre>
  
  <p>It also consists of some javascript functions but I think they have nothing to do with my problem.I will be really really thankful for your help,this has become a big problem for me.
  also some one suggested me to use normalize.css I copy and pasted it to ma stylesheet and included it in my website,but nothing changed.</p>