Css 在div中居中固定图像

我在这里创建了一个JSFIDLE：

我试图做的是让down_arrow.png在它们的包含div中居中。我能够使用自动边距将up_arrow.png居中。我使用fixed属性将它们用作页脚，因为我希望它们位于div的底部，而不管分辨率如何

我的问题是，在包含div的宽度内，将底部固定图像居中的最佳方法是什么

fiddle中的一些代码（StackOverflow格式有问题）：

我应该补充一点，我根本不关心IE黑客/变通方法，这个应用程序不会以任何方式针对IE。

---

任何评论和回答都将不胜感激。

您可以将箭头向下的图像包装在一个与底部对齐的div中。然后可以将div设置为以其内容为中心

以HTML进行包装：

<div id="list1">
  <img src="image/up_arrow.png" class="scroll-arrow-up">
  <p class="list-title" id="list-title1">Autonomous Behaviors</p>
  <div class=".scroll-arrow-down">
    <img src="image/down_arrow.png">
  </div>
</div>

---

如果使用“固定位置”，它将固定到视口（我认为您不需要）。使用绝对定位将参照包含图像的项目定位图像

我加了一个左：45%；它几乎是事物的中心，但取决于可能需要更新的箭头的宽度

.scroll-arrow-down {
    position: absolute;
    bottom:0;
    left: 45%;
}

---

.name{位置：固定；底部：0；左侧：50%；左边距：-px；/*imgage width/2*/}

.scroll-arrow-down {
  position: absolute;
  bottom: 0;
  background-color: red;
  width: 100%;
  text-align: center;
}

.scroll-arrow-down {
    position: absolute;
    bottom:0;
    left: 45%;
}