title: Position fixed padding
body: <p>I'm trying to get two divs to stick together at the bottom of the page using position:fixed.  The problem is when I put padding on the #feedbackTab, it repeats the #feedbackTab from the bottom of the page to the place where I want it.  How can I have #feedbackTab on top of #feedbackBody with both of them fixed to the bottom of the page?</p>
  
  <pre><code>#feedbackTab {
  background-image:url(../img/feedback_12.png);
  position:fixed;
  bottom:0px;
  padding-bottom:300px;
  margin:0;
  width:960px;
  height:34px;
  }
  
  #feedbackBody {
  background-image:url(../img/Feedback_bkg_14.png);
  position:fixed;
  bottom:0px;
  width:960px;
  height:292px;
  margin:0;
  }
  
  &lt;div id="feedback"&gt;
          &lt;div id="feedbackTab"&gt;&lt;/div&gt;
          &lt;div id="feedbackBody"&gt;
              &lt;div id="comments"&gt;
                  &lt;h2&gt;Comments/Suggestions&lt;/h2&gt;
                  &lt;input class="commentsTxt" type="text" name="Comments"&gt;&lt;br \&gt;
                  &lt;input id="commentsSubmit" type="submit" value="Submit"&gt;
            &lt;/div&gt;&lt;!-- end comments --&gt;
              &lt;div id="problems"&gt;
                  &lt;h2&gt;Problems?&lt;/h2&gt;&lt;br \&gt;
                  &lt;label id="email"&gt;Email:&lt;/label&gt;&lt;input class="emailBox" type="text" name="Email"&gt;&lt;br \&gt;
                  &lt;label id="problem"&gt;Problem:&amp;nbsp;&lt;/label&gt;&lt;input class="problemBox" type="text" name="Comments"&gt;&lt;br \&gt;
                  &lt;input id="problemsSubmit" type="submit" value="Submit"&gt;
              &lt;/div&gt;&lt;!-- end problems --&gt;
        &lt;/div&gt;&lt;!-- end feedbackBody --&gt;
      &lt;/div&gt;&lt;!-- end feedback --&gt;
  </code></pre>