JSFiddle - React, Tailwind, and code Playground

HTML

<div class="table">
		<div class="th">
			<p class="td td1">
				Наименование
			</p>
			<p class="td td2">
				Размер
			</p>
			<p class="td td3">
				Кол-во в упаковке
			</p>
			<p class="td td4">
				Кол-во для заказа
			</p>
			<p class="td td5">
				Цена
			</p>
			<p class="td td6">
				
			</p>
		</div>
		<div class="tr">
			<p class="td td1">
				<a href="#">Наименование будет длинным будет будет будет будет будет будет будет</a>
			</p>
			<p class="td td2">
				8х45
			</p>
			<p class="td td3">
				20 штук
			</p>
			<p class="td td4">
				
			</p>
			<p class="td td5">
				3,39 р.
			</p>
			<p class="td td6">
				<a href="#" class="btn-cart">В корзину</a>
			</p>
		</div>
		<div class="tr">
			<p class="td td1">
				<a href="#">Наименование</a>
			</p>
			<p class="td td2">
				8х45
			</p>
			<p class="td td3">
				20 штук
			</p>
			<p class="td td4">
				
			</p>
			<p class="td td5">
				3,39 р.
			</p>
			<p class="td td6">
				<a href="#" class="btn-cart">В корзину</a>
			</p>
		</div>
	</div>

CSS

.table {
	display: table;
	border-collapse: collapse;
	font-size: 13px;
	text-align: center;
}


.th, .tr {display: table-row;}

.th {
	color: #9d9d9d;
	background-color: #f7f7f7;
	min-height: 41px;
}

.tr {
	background-color: #efefef;
}

.td {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	padding: 10px 0;
	border: 2px solid #fff;
}

.td1 a {color: #0069bc; text-decoration: underline;}

.td1 a:hover {text-decoration: none;}


.td1 {width: 137px;}

.tr .td1 {
	text-align: left;
	padding: 10px;
}

.td2 {width: 103px;}

.td3 {width: 131px;}

.td4 {width: 124px;}

.td5 {width: 93px;}

.td6 {width: 93px;}

.th .td6 {background-color: #fff;}