title: How to make a responsive div?
body: <p>I'm making an application using CSS and div in HTML, it's a restaurant menu, i have a wireframe that i must obey, so i'm using a pixel positioning inside the CSS not a percent ratio, so when opening the website in a maximized state is looks like:</p>
  
  <p><img src="https://i.stack.imgur.com/mLoBu.png" alt="enter image description here"> </p>
  
  <p>But when minimizing it of curse it's sizes and positions don't response to that :</p>
  
  <p><img src="https://i.stack.imgur.com/jLsKe.png" alt="enter image description here"></p>
  
  <p><strong>here is the <a href="http://jsfiddle.net/J9GNV/" rel="nofollow noreferrer">fiddle</a></strong></p>
  
  <p>****The Code:**</p>
  
  <p><strong>*CSS:</strong></p>
  
  <pre><code>    .buttonClass {
      width: 381px;
      height: auto;
      text-align: center;
      line-height: normal;
      border-radius: 7px;
      z-index: 3;
      background-image: -webkit-linear-gradient(top,#FFF 0%,#91BDD6 100%);
      background-image: -moz-linear-gradient(top, #FFFFFF 0%, #91BDD6 100%);
      background-image: -ms-linear-gradient(top,#FFF,#91BDD6);
      background-image: -o-linear-gradient(top,#FFF,#91BDD6);
      background-image: linear-gradient(top,#FFF,#91BDD6);
      border: solid #91BDD6 5px;
      box-shadow: 0px 0px 0px 5px #fff, 5px 3px 12px #000000;
      position: absolute;
      right:0;
      bottom:0;
  }
  
  .totalClass {
      width: 376px;
      height: 30px;
      padding: 10px 10px;
      text-align: center;
      line-height: normal;
      border-radius: 7px;
      z-index: 3;
      background-image: -moz-linear-gradient(top, #FFFFFF 0%, #91BDD6 100%);
      position: absolute;
      right: 0;
      top: 700px;
  }
  </code></pre>
  
  <p><strong>*div:</strong></p>
  
  <pre><code>&lt;div id="confirm" class="buttonClass"&gt;
    &lt;div align="center"&gt;Confirm&lt;/div&gt;
  &lt;/div&gt;    
  
  &lt;div id="total" class="totalClass"&gt;
    &lt;div align="left"&gt;&lt;/div&gt;
  &lt;/div&gt;      
  </code></pre>