JSFiddle - React, Tailwind, and code Playground

by schettino72

HTML

<!-- As big as it can be, max: 30em; -->
<div class="body">A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart. I am alone, and feel the charm of existence in this spot, which was created for the bliss of souls like mine. I am so happy, my dear friend, so absorbed in the exquisite sense of mere tranquil existence, that I neglect my talents. I should be incapable of drawing a single stroke at the present moment; and yet I feel that I never was a greater artist than now. When, while the lovely valley teems with vapour around me, and the meridian sun strikes the upper surface of the impenetrable foliage of my trees</div>

CSS

.body {
    max-width: 30em;
    border: 1px solid green;
    margin: auto;
}
/* 42em = 30 + (2*6) */
@media screen and (min-width: 42em) {
    .body {
        margin-left: 6em;
    }
}