JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container"></div>

CSS

.container {width:640px; height:480px; background:#000;}

JavaScript

$(document).ready(function(){
    $(window).width();   // returns width of browser viewport
    $(document).width(); // returns width of HTML document

    $(window).height();   // returns heightof browser viewport
    $(document).height(); // returns height of HTML document

    var width = $(window).width(); // the window width
    var height = $(window).height();  // the window height
    var containerwidth = $('.container').outerWidth(); // the container div width
    var containerheight = $('.container').outerHeight(); // the container div height

    if ((width >= containerwidth) && (height>=containerheight)){ //if the width and height of the window is bigger than the container run this function                 
     $(window).resize(function(){
      $('.container').css({
       position:'absolute',
       left: ($(window).width() 
         - $('.container').outerWidth())/2,
       top: ($(window).height() 
         - $('.container').outerHeight())/2
      });   
     });
     // To initially run the function:
     $(window).resize();
    });
    }
    });