title: How to prevent div elements from moving when the browser gets resized?
body: <p>I'm doing a website for a school work, but when I resize the screen and make it a little wider, the <code>div</code> elements are getting out of their place.</p>
  
  <p>How can I prevent this?</p>
  
  <p><strong>most of the divs are:</strong> </p>
  
  <pre><code>.menu {
      padding-top:120px;
      position:absolute;
      color:white;
      font-size:28pt;
      font-weight:Bolder; 
  }
  </code></pre>
  
  <p><strong>My html:</strong></p>
  
  <pre><code>&lt;body id="BODY" class="BDNL" onResize="MOSTRA()"&gt; 
    &lt;div id="resizing" class=""&gt;
      &lt;div id="intro" class="divintro"&gt;
        &lt;p id="p" class="comeco"&gt;Trabalho Interdisciplinar Orientado:&lt;/p&gt;
        &lt;p id="texto" class="txtcomum"&gt;
          Trabalho no qual um grupo deve elaborar um site que &lt;br /&gt;
          relacione todas as matérias técnicas estudadas.
        &lt;/p&gt;
      &lt;/div&gt;
      &lt;form&gt;
        &lt;div id="menu" class="menu"&gt;
          &amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;
          &lt;a href="index.html"&gt;&lt;label&gt;RECO&lt;/label&gt;&lt;/a&gt;
          &amp;nbsp;&amp;nbsp;&amp;nbsp; | &amp;nbsp;&amp;nbsp;&amp;nbsp;
          &lt;a href=""&gt;&lt;label&gt;LOCO&lt;/label&gt;&lt;/a&gt;
          &amp;nbsp;&amp;nbsp;&amp;nbsp; | &amp;nbsp;&amp;nbsp;&amp;nbsp;
          &lt;a href=""&gt;&lt;label&gt; LP1&lt;/label&gt;&lt;/a&gt;
          &amp;nbsp;&amp;nbsp;&amp;nbsp; | &amp;nbsp;&amp;nbsp;&amp;nbsp;
          &lt;a href=""&gt;&lt;label&gt; LP2&lt;/label&gt;&lt;/a&gt;
          &amp;nbsp;&amp;nbsp;&amp;nbsp; | &amp;nbsp;&amp;nbsp;&amp;nbsp;
          &lt;a href=""&gt;&lt;label&gt; INFO&lt;/label&gt;&lt;/a&gt;
        &lt;/div&gt;
      &lt;/form&gt;
    &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>