JSFiddle - React, Tailwind, and code Playground

HTML

<div id="main">
here goes the centered text
</div>

CSS

#main {
  width:300px;
  height:500px;
}

JavaScript

jQuery.fn.center = function () {
    this.css("position","absolute");
    this.css("top", (($(window).height() - this.outerHeight()) / 2) + $(window).scrollTop() + "px");
    this.css("left", (($(window).width() - this.outerWidth()) / 2) + $(window).scrollLeft() + "px");
    return this;
}
$(#main).center();