col-span-2

The col-span-2 class ensures an item spans two column in a grid.

Example Code

<div class="rounded-t-md p-4 bg-indigo-50">
	<div class="grid grid-cols-2 gap-4">
		<div class="bg-indigo-500 text-white p-4 font-bold text-center">A</div>
		<div class="bg-indigo-500 text-white p-4 font-bold text-center">B</div>
		<div class="bg-indigo-500 text-white p-4 font-bold text-center col-span-2">
			C
		</div>
		<div class="bg-indigo-500 text-white p-4 font-bold text-center">D</div>
	</div>
</div>

Preview

Add the following col-span-4, col-span-6, col-span-8, col-span-12, col-span-full, col-start-4, col-start-2, col-start-6, col-start-8, col-start-12, col-end-2, col-end-4, col-end-6, col-end-8, col-end-12, col-end-13, row-span-2, row-span-4, row-6, row-span-8, row-span12, row-span-full, row-start-2, row-start-4, row-start-6, row-start-8, row-start-12, row-end-2, row-end-4, row-end-6, row-end-8, row-end-12, row-end-13, grid-flow-row, grid-flow-col, justify-center, justify-end, justify-start, justify-between, justify-around, justify-evenly, justify-items-start, justify-items-end, justify-items-center and justify-items-stretch