Trick with footer

Thanks for the theme! I am use it on own personal site.
I am use next trick, because footer looks not so good, if there's content with small height content, see image please.

I am use next http://www.cssstickyfooter.com/html-code.html for placing footer to the bottom of browser:
style.css, added on the top:

html {
  height: 100%;
}
body {
  background-color: #f8f7f7;
  color: #666;
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 14px;
  margin: 0px;
  height: 100%;
}

#wrap {min-height: 100%;}
#main0 {
  overflow:auto;
  padding-bottom: 100px;
}  /* must be same height as the footer */
#footer0 {
  position: relative;
  margin-top: -100px; /* negative value of footer height */
  height: 100px;
  clear:both;
} 

/* Opera Fix, for Opera 12 it doesn't need */
body:before {/* thanks to Maleika (Kohoutec)*/
  content:"";
  height:100%;
  float:left;
  width:0;
  margin-top:-32767px;/* thank you Erik J - negate effect of float*/
}

page.tpl.php

<div id="wrap">
  <div id="main0">

    <div id="header">
     // HERE YOUR CODE from header to maincontainer.
    </div><!--maincontainer-->

  </div> <!--main0-->
</div> <!--maincontainer-->

<div id="footer0">
     
  <div id="footer">
  // HERE your footer to footer2 closing div.
  </div>

</div> <!--footer0-->

One minus: You should know your footer height (usually it's fixed)...