У меня не получается выставить иконки соц. сетей по центру блока footer
. Нужно что бы они встали по центру по вертикали и по горизонтали.
Я пробовал через margin-left: auto;
и margin-right: auto;
, что бы выставить их по центру по горизонтали, но не получается. Так же пробовал через text-align: center;
и vertical-align: center;
, но так же ничего не получалось.
.container {
width: 1170px;
margin-right: auto;
margin-left: auto;
}
.footer {
width: 100%;
height: 83px;
background-color: #f4f7f6;
margin-bottom: 64px;
}
.social {
display: flex;
}
.icon {
width: 25px;
height: 21px;
margin-right: 24px;
}
<footer>
<div class="container">
<div class="footer">
<!-- Соц. сети -->
<div class="social">
<div class="icon">
<a href="#"><img src="https://netology-code.github.io/html-2-diploma/sources/images/social/004-twitter.svg" alt=""></a>
</div>
<div class="icon">
<a href="#"><img src="https://netology-code.github.io/html-2-diploma/sources/images/social/001-pinterest.svg" alt=""></a>
</div>
<div class="icon">
<a href="#"><img src="https://netology-code.github.io/html-2-diploma/sources/images/social/003-tumblr.svg" alt=""></a>
</div>
<div class="icon">
<a href="#"><img src="https://netology-code.github.io/html-2-diploma/sources/images/social/005-instagram.svg" alt=""></a>
</div>
</div>
</div>
</div>
</footer>