JSFiddle - React, Tailwind, and code Playground

HTML

<main>
<div class="c1">
<p>
Text1 
</p>
<p>
Text2
</p>
<p>
Text3
</p>
</div>

<div class="c2">
<span>
Text1 
</span>
<span>
Text2
</span>
<span>
Text3
</span>
</div>
</main>

CSS

div.c1 {
  display: grid;
  grid-template-columns: repeat(3, max-content);
}

div.c2 {
  display: grid;
  grid-template-columns: max-content;
 
}