JSFiddle - React, Tailwind, and code Playground

HTML

<main>
<div>
<p>
Text1 
</p>
<p>
Text2
</p>
<p>
Text3
</p>
</div>
</main>

CSS

main {
  display: grid;
  /* grid-template-columns: repeat(3, max-content); */
  /* grid-template-columns: repeat(315, min-content); */
  /* grid-template-columns: repeat(1, max-content); */
  /* grid-template-columns: min-content; */
  grid-template-columns: min-content;
  border: 2px dashed blue;
}

div {
  display: grid;
  grid-template-columns: max-content;
  grid-auto-flow: column;
}

p { border: 1px solid red;}