JSFiddle - React, Tailwind, and code Playground

by Tech Savant

HTML

<body>
    <div id="foo" class="centerer">
        .....
    </div>
</body>

CSS

#foo {
    background: white url("bg.jpg") center no-repeat;
    background-size: 100vw auto;
}

.centerer {
    display: flex;
    flex-flow: column nowrap;
    align-items: center;
    justify-content: center;
}

JavaScript

(function($){

    $(function(){  //document.ready

    console.log("1 display: " + $("#foo").css("display"));
    $("#foo").hide();
    console.log("2 display: " + $("#foo").css("display"));
    $("#foo").show();
    console.log("3 display: " + $("#foo").css("display"));

  });
       
    })(jQuery);