css - 在页脚中将我的图标 float 到右侧

Question

我有一个问题.. 我正在尝试制作页脚栏，但效果不是很好。

版权标志、年份和我的名字在左边，社交图标必须在右边。我无法解决这个问题! ;( 我不能将它向右浮动。

如果有人知道它是如何工作的，请使用react! :D

footer {
  width: 100%;
  height: 50px;
  clear: both;
  background-color: #303030;
  color: #868686;
  position: relative;
}
footer span {
  display: table-cell;
  vertical-align: middle;
  height: 50px;
}
.footerwidth {
  width: 80%;
  margin: 0 auto;
}
.icons {
  float: right;
  width: 150px;
}

<footer>

  <div class="footerwidth">
    <span>&copy 2016 Jasper Mulder
        <div class="icons">
        <a href="#"><img src="../images/icons/facebook.png"></a>
        <a href="#"><img src="../images/icons/instagram.png"></a>
        <a href="#"><img src="../images/icons/linkedin.png"></a>
        </div>
        </span>
  </div>

</footer>

谢谢你帮助我!

Answer 1

更改您的 HTML 并将社交图标放在版权范围之前:

<footer>
  <div class="footerwidth">
    <div class="icons">
        <a href="#"><img src="../images/icons/facebook.png"></a>
        <a href="#"><img src="../images/icons/instagram.png"></a>
        <a href="#"><img src="../images/icons/linkedin.png"></a>
    </div>
    <span>&copy 2016 Jasper Mulder</span>
  </div>
</footer>