JSFiddle - React, Tailwind, and code Playground

by RedSniper

HTML

<div class="slider">
<div class="left-arrow"><a href=""><img src="img/Frame (1).png" alt="left arrow"></a></div>
<div class="pictur"><a href=""><img src="img/Group 2.1.png" alt="picture slider"></a></div>
<div class="right-arrow"><a href=""><img src="img/Frame.png" alt="right arrow"></a></div>

</div>
<div class="programming">
	#программирование

</div>
<div class="logo_footer"><img src="img/Group 4.png" alt="logo"></div>
<div class="social">
	<p class="year">© 2019</p>
	<div class="vk" >Вконтакте</div>
	<div class="tg" c>Телеграмм</div>
 <div class="youtube">Ютуб</div>
</div>

CSS

.slider {
	flex-grow: 3;
	display: flex;
	justify-content: space-around;
	text-align: center;
	margin-bottom: 13.5px;
}

input[type="image"]:focus {
	outline: none;
}

.programming {
	margin-bottom: 35px;
	text-align: center;
	font-family: Montserrat;
	font-style: normal;
	font-weight: 600;
	font-size: 24px;
	line-height: 29px;
	color: #FFFFFF
}

.logo_footer {
	text-align: center;
}

.social  {
	font-family: Montserrat;
	font-size: 12px;
	line-height: 15px;
	display: flex;
	justify-content: center;
	color: #C4C4C4;


}

.social div {
	margin-right: auto;
	flex-grow: 3;
	text-align: right;

}
.social{
	margin-left: auto;
	display: flex;
}
p{
	display: block;
	text-align: left;
}
.vk{
	text-align: right;
	margin-right: 100px;
}