Separate Footer and Wrapper

simply move the closing div
</div><!-- #wrapper -->
from the position at the end of #footer to a position before the div #footer begins;

in footer.php, move it to after this line:
</div><!-- #main -->

luckily, the closing divs are nicely commented in twenty ten.

you might need to add extra styles to center the detached #footer div and replace the padding of #wrapper.
and add a top margin as @chip Bennett rightly suggested.

would you know how to do this in the mystique theme? there is no </div><!–#main –> in the footer.php file. Also I’m very much a novice at adjusting php and css stuff so sorry if this is an elementary question