Tailwind CSS を使用してグリッド内の項目の最後の行を中央に配置するにはどうすればよいですか?
<p>Tailwind を (React を使用して) 使用して最終プロジェクトをグリッド レイアウトに配置しようとすると問題が発生します。基本的には 3 つのアイテムが必要で、3 つのアイテムが残っていない場合、つまり 2 つまたは 1 つがある場合は、それらを中央に配置したいと考えています。 </p>
<p>ある種の Col Span を試しましたが、期待どおりに機能しませんでした。 </p>
<p>私がやろうとしていることをわかりやすく説明するために、いくつかの図を添付しました</p>
<p>現在のレイアウト: </p>
<p>残り 2 項目を含む希望のレイアウト: </p>
<p>残り 1 項目の希望のレイアウト: </p>
<pre class="brush:html;toolbar:false;"><div className="xl:grid Grid-cols-3 Gap-4">
//カード .map(item)
</div>
</pre></p>