Javascript behaves differently on Mac and PC? I know it shouldn't

I created a pagination script that takes a long block of text and paginates it. First, the text is loaded into a div with id #page. The script then measures the height of the #page and calculates how many pages it should be split into nesting in a div with a .detailsholder class.

The div.detailsholder is removed and the corresponding number of sections are added inside it. (Each actually has all the text # of the page inside, but the top margin is set non-agent-wise, the height is fixed, and the overflow is set to hidden, so only the corresponding amount appears.)

And it works great except for this: while Safari and Firefox on Mac work great, IE and Firefox on Windows add an extra page. Because of the way the pages are created, as described in parentheses above, the last page appears to be empty - the text has moved too far to appear in the page window.

Here is the code. I am using jQuery as you can see.

var descHeight = $('#page').outerHeight();
if (descHeight > 250 ) {
   var numberOfPages = Math.round(descHeight/210)+1; //Figure out how many pages
   var artistText = $('#page').html();               //Grab the text into a variable
   $('.detailsholder').empty();                      //Empty the container so we can fill
                                                     //it with pages
   for (i=0;i<=numberOfPages-1;i++) {                //Each page has the entire text
                                                     //content, but is shifted up and
      var shiftUp = 0-(210 * i);                     //cut off at the bottom.
      $('.detailsholder').append('<div id="page' + (i+1) + '" class="page" style="height:225px;"><div style="border:dotted 1px red;margin-top:' + shiftUp + 'px"' + artistText + '</div>');
}

      

        
        
        
      

    

}

Thanks!