在div中水平居中图像

Question

在div中水平居中图像

这可能是一个愚蠢的问题，但由于中心对齐图像的常用方法不起作用，我想我会问。如何在容器div中居中对齐（水平）图像？

这是HTML和CSS。我还为缩略图的其他元素添加了CSS。它按降序运行，因此最高元素是所有内容的容器，最低元素是所有内容。

#thumbnailwrapper {
      color: #2A2A2A;
      margin-right: 5px;
      border-radius: 0.2em;
      margin-bottom: 5px;
      background-color: #E9F7FE;
      padding: 5px;
      border: thin solid #DADADA;
      font-size: 15px}
    #artiststhumbnail {
      width: 120px;
      height: 108px;
      overflow: hidden;
      border: thin solid #DADADA;
      background-color: white;}
    #artiststhumbnail:hover {
      left: 50px}

<!--link here--><a href="NotByDesign">
  <div id="thumbnailwrapper">

    <a href="NotByDesign">

      <!--name here-->
      <b>Not By Design</b>
      <br>

      <div id="artiststhumbnail">

        <a href="NotByDesign">

          <!--image here-->
          <img src="../files/noprofile.jpg" height="100%" alt="Not By Design" border="1" />
        </a>
      </div>

      <div id="genre">Punk</div>

  </div>

好的，我已经添加了没有PHP的标记，所以应该更容易看到。这两种解决方案似乎都没有实际应用。顶部和底部的文本无法居中，图像应在其容器div中居中。容器已隐藏溢出，因此我希望看到图像的中心，因为它通常是焦点所在的位置。