JSFiddle - React, Tailwind, and code Playground

by karthick6891

HTML

<!-- centering css3 -->

<section>

  <h1>Nicely centered</h1>

  <p>This text block is vertically centered.

  </p><p>Horizontally, too, if the window is wide enough.
  </p></section>

CSS

body {
        background: white }
    section {
        background: black;
        color: white;
        border-radius: 1em;
        padding: 1em;
        position: absolute;
        top: 50%;
        left: 50%;
        margin-right: -50%;
        transform: translate(-50%, -50%) }