title: Keeping divs in shape
body: <p>I have a few issues that I can't really get.</p>
  
  <p>a. If I do something like: </p>
  
  <pre><code>    position: absolute;
      top: 0px;
      width: 100%;
      padding: 10px;
  </code></pre>
  
  <p>Scrollsbars in my browser will appear. How to avoid that? I want my top bar to be full width, with padded content but I don't want it to exceed real width and make scrollbars appear. How to do that?</p>
  
  <p>b. Do you have any articles on how to scale website elements according to user's resolution? When I try it with </p>
  
  <pre><code>    position: absolute;
      top: (some percentage)%
      left: (some percentage)%
  </code></pre>
  
  <p>It's never accurate. With pixels instead of percents - it's not accurate either for different resolutions.</p>
  
  <p>c. Menu overlay</p>
  
  <p>Is there any way to level divs so that my drop-down css-only menu doesn't appear BEHIND divs ? When that happens, I can't click on certain items in that menu because they hide behind a body div.</p>
  
  <p>Thanks in advance!</p>