如何使divs第一个孩子居中对齐，最后一个孩子居中对齐？

Question

一直在尝试解决这个烦人的问题。

我必须在网站和母亲div中间对齐版权文字。并对齐一些社交媒体图标和链接。

我一直在尝试所有事情，这是结果。完全是意大利面条的代码。

.copyright {
  width: auto;
  background-color: yellow;
  display: flex;
  height: auto;
  width: 100%;
  text-align: center;
}

.copyright p {
  background-color: red;
  margin-top: 10px;
  display: inline-block;
  flex: 1;
  display: flex;
  justify-content: flex-end;
  color: #e4e5df;
}

.copyright-icon {
  height: 30px;
  border-radius: 100px;
  margin-left: 20px;
}

.copyright-icons {
  background-color: black;
  margin-top: 10px;
  display: inline-block;
  flex: 1;
  display: flex;
  justify-content: flex-end;
}

<div class="copyright">
  <p>Copyright Massi.com</p>
  <div class="copyright-icons"><img class="copyright-icon" href="" src="img/instagram.png"><img class="copyright-icon" src="img/facebook.png"><img class="copyright-icon" src="img/mail.png"><img class="copyright-icon" src="img/twitter.png"></div>
</div>