JSFiddle - React, Tailwind, and code Playground

by jmpp77

HTML

<section>
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Facere eveniet doloremque veniam, nesciunt expedita, vel.</p>
</section>

<section class="section-blue">
  <p>At ad error quis saepe ex sunt modi! Nemo omnis perferendis nulla nobis temporibus saepe.</p>
</section>

<section class="centered">
  <p>Possimus ratione vitae omnis minima non ipsum, veniam ea accusantium deleniti libero suscipit architecto, itaque.</p>
</section>

<section class="section-blue centered">
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum dicta ut soluta assumenda, consectetur nemo eum saepe, aperiam, est vitae id perspiciatis iste quos repudiandae aliquam eaque dolor labore. Quos voluptatibus ab porro in non magni, enim, tempore assumenda suscipit culpa dignissimos aperiam unde sint vel nam doloribus, quibusdam fugiat itaque labore dolore consequuntur. Minus reprehenderit impedit dolorum, architecto aliquam molestias harum eos sequi, cumque. Dolor iusto ipsa, sequi voluptatibus dicta dolore minus, ratione officiis. Autem aut magnam nesciunt qui ut, dolores sed saepe quam dignissimos, earum esse laudantium! Vitae assumenda rerum eos deserunt, laudantium magnam pariatur unde. Corporis, possimus labore consequatur ea tempore mollitia ab nostrum veritatis cupiditate commodi cumque placeat laborum dolorum, aut reiciendis odio. Deserunt atque architecto inventore fugiat, voluptatibus accusamus eum non quo dicta dolore, reiciendis sed? Iusto molestiae ut doloribus, quaerat et quas illo neque nesciunt quisquam, numquam architecto adipisci unde provident iste. Consectetur, beatae.</p>
</section>

CSS

section {
  margin: 0 auto;
  max-width: 960px;
  padding: 15px;
  background-color: silver;
}

.section-blue {
  background-color: cyan;
}

.centered {
  text-align: center;
}