如何在平坦的位置定位图像

Question

我正在使用CSS + HTML设计一个Web UI，我需要开发以下设计。

我将结构设计如下。

<div class="slider-pager-container">
        <div class="content">
            <div class="slider-pager" id="slider-pager">
              <a data-slide-index="0" href=""><img height="90px" src="/images/slider/thumbs/image_1_thumb.jpg" /></a>
              <a data-slide-index="1" href=""><img height="90px" src="/images/slider/thumbs/image_2_thumb.jpg" /></a>
              <a data-slide-index="2" href=""><img height="90px" src="/images/slider/thumbs/image_3_thumb.jpg" /></a>
              <a data-slide-index="3" href=""><img height="90px" src="/images/slider/thumbs/image_4_thumb.jpg" /></a>
              <a data-slide-index="4" href=""><img height="90px" src="/images/slider/thumbs/image_5_thumb.jpg" /></a>
            </div>
        </div>
    </div>

问题在于我希望图像的宽度可变但固定高度。我已经通过使用img选项卡中的height属性完成了这项工作。我已经使用以下CSS将imgs定位在偶数位置。

.slider-pager{
     display:table;
}
.slider-pager a{
     display:table-cell;
}

这样做，但是，父元素的固定宽度为970px，如果所有imgs的总宽度小于该值，则会在两个图像之间产生巨大的差距。我想要实现的是无论图像宽度是什么（小于父元素），img标签位于页面中心。如何在不使用CSS3属性的情况下实现这一点，因为我希望它与IE 6 +兼容。

Answer 1

CSS

.slider-pager{
  margin: 0 auto;
}

Like this? - Fiddle