JSFiddle - React, Tailwind, and code Playground

by harinus

HTML

<h2 class="title">Технические характеристики</h2>	
						<div class="crane-tech__block">	
							<div class="crane-tech__content">
								<ul class="crane-tech__list">
									<li class="crane-tech__item">НПВ: 5000 кг</li>
									<li class="crane-tech__item">Цена деления: 2 кг</li>
									<li class="crane-tech__item">Габариты: 680*250*210</li>
									<li class="crane-tech__item">Масса: 20 кг</li>
									<li class="crane-tech__item">Дисплей: светодиодный повышенной яркости, высота 40мм/5 цифр</li>
									<li class="crane-tech__item">Диапазон рабочих температур, C: от -10 до +40</li>
									<li class="crane-tech__item">Функции: взвешивание, вычет массы тары во всем диапазоне, обнуление, суммирование</li>
									<li class="crane-tech__item">Питание: встроенный аккумулятор</li>
								</ul>
								<a href="files/10t lite.pdf" target="_blank" class="download">Скачать паспорт на крановые весы</a>
								<a href="files/pasport.pdf" target="_blank" class="download">Скачать описание типа на крановые весы</a>
								<a href="files/pasport.pdf" target="_blank" class="download">Скачать ТКП</a>
							</div>
							<div сlass="crane-tech__pic">
								<img src="https://3d-m.ru/wp-content/uploads/2016/08/Shining-Cert-3DMALL-723x1024.jpg" alt="">
							</div>
						</div>

CSS

.crane-tech {
}
.crane-tech__content {
   font-weight: 300;
}
.crane-tech__block {
   display: flex;
}
.crane-tech__list {
   margin-bottom: 20px;
   max-width: 700px;
   margin-right: 50px;

}
.crane-tech__item {
   margin-bottom: 15px;
   width: 100%;
}
.download {
   display: block;
   text-decoration: none;
}

.crane-tech__pic img {
   height: 400px;
   width: 300px;
}