JSFiddle - React, Tailwind, and code Playground

by zerolfc

HTML

<div id="page">
    <article></article>
    <div id="obj"></div>
</div>

CSS

#page {
    overflow-y: scroll;
    overflow-x: hidden;
    display; block;
    width: 100%;
    height: 100%;
    background-color: #333;
    position:absolute;
    left: 0x;
    top: 0px;
    display: block;
    
}

article {
    top: 0px;
    opacity: 1;
    height: 420px;
    width: 300px;
    margin-left:-150px;
    background-color:#ccc;
    left: 50%;
    position: absolute;
}
#obj {
    position:absolute;
    left: 205px;
    top: 19px;
    width: 100px;
    height: 50px;
    background-color: rgb(0, 0, 0);

}

JavaScript

var page_left = ( parseInt( $('#page').css('width') ) / 2 ) - ( 300 / 2 ) ;

console.log (page_left);