JQM fixed footer “floating” issue

JQM fixed footer “floating” issue

In JQM I want to have a fixed footer but at the same time have a max width of the page (contents to the left). It works fine until I add data-position="fixed" (fixed footer). The footer now fills the whole window and not just 480px. Is this OK or is it a bug? Any ideas how to solve the problem?

<div data-role="footer" data-theme="a" data-position="fixed"><h1> </h1> </div>

JS:

$(document).ready(function() { 
      if ($(window).width() > 480) {
            $('#page1').css('width', '480px' );
      }
});
$(window).resize(function() {
      if ($(window).width() <= 480) {
               $('#page1').css('width', '' );}
      else {
               $('#page1').css('width', '480px' );
      }
});