How to properly align pictures in CSS - html

Question

I have 3 icons that i want to align them in the center i tried different code but nothing is working so far, i tried putting a margin right to it, but the problem with that is that it's adding an unnecessary space between them, so i want them to be close to each other, is there a way to put margin-right to it and remove the space from there ?
i just want to align them below my paragraph but in the center of it.
heres my code so far.
#body a img {
width: 50px;
height: 50px;
margin-top: 50px;
margin-right: 200px;
}
<div id="body">
<p class="text">We are a group of friends that enjoy playing League Of Legends togather, feel free to follow us on our different website medias</p>
<div class="icons">
<a href="https://www.youtube.com/themunkiuke">
<img class="icon1" src="images/youtube.png">
</a>
<a href="http://www.twitch.tv/siminios">
<img class="icon2" src="images/twitch.png">
</a>
<a href="http://yinochi.deviantart.com/gallery/">
<img class="icon3" src="images/art.png">
</a>
</div>

Answer 1

Will it be a simple text-align missing ?
#body a img {
width: 50px;
height: 50px;
}
.icons {
text-align:center;
}
<div id="body">
<p class="text">We are a group of friends that enjoy playing League Of Legends togather, feel free to follow us on our different website medias</p>
<div class="icons">
<a href="https://www.youtube.com/themunkiuke">
<img class="icon1" src="images/youtube.png">
</a>
<a href="http://www.twitch.tv/siminios">
<img class="icon2" src="images/twitch.png">
</a>
<a href="http://yinochi.deviantart.com/gallery/">
<img class="icon3" src="images/art.png">
</a>
</div>

Answer 2

Here you are DEMO
#body a img {
width: 50px;
height: 50px;
}
.icons {
text-align: center;
}
<div id="body">
<p class="text">We are a group of friends that enjoy playing League Of Legends togather, feel free to follow us on our different website medias</p>
<div class="icons">
<a href="https://www.youtube.com/themunkiuke">
<img class="icon1" src="images/youtube.png">
</a>
<a href="http://www.twitch.tv/siminios">
<img class="icon2" src="images/twitch.png">
</a>
<a href="http://yinochi.deviantart.com/gallery/">
<img class="icon3" src="images/art.png">
</a>
</div>

Answer 3

Here's a demo https://jsfiddle.net/r4wwczao/
In HTML I added a container for each icon to give them a percent size (the border is just to see the solution better):
<div id="body">
<p class="text">We are a group of friends that enjoy playing League Of Legends togather, feel free to follow us on our different website medias </p>
<div class="icons">
<div class="icon_div">
<img class="icon1" src="images/youtube.png">
</div>
<div class="icon_div">
<img class="icon2" src="images/twitch.png">
</div>
<div class="icon_div">
<img class="icon3" src="images/art.png">
</div>
</div>
</div>
And CSS:
img{
width: 50px;
height: 50px;
}
.icon_div{
border:1px black solid;
display: inline-block;
text-align: center;
width:32%;
}