Jquery & CSS 定位绝对居中

Question

我的图片一直有问题。它实际上是一个 jquery 幻灯片。图片的位置是绝对的，这使得它们很难居中...

这对我有用

 #slideshow IMG {
    position:absolute;
    top:0;
    left:0;
    z-index:8;
    opacity:0.0;
    width:100%;
    text-align:center;
}

但宽度为 100% 时，它使图像 100% 位于其内部的 div 中。有些图像比其他图像更薄，我只希望这些图像居中。宽度为 100% 时，它会拉伸(stretch)薄图像。

这是HTML

<div class="contentImages">

<div id="slideshow">

<img src="upload/<?php echo $array['image'] ?>" height="200" class="active" />

<img src="upload/<?php echo $array['image2'] ?>" height="200" />

<img src="upload/<?php echo $array['image3'] ?>" height="200" />

</div></div>

和其余的 CSS

#slideshow {
    position:relative;
    height:200px;
    overflow:hidden;
    float:left;
    width:250px;
}

.contentImages{
    border:1px solid #CCC; 
    padding:10px; 
    margin:20px auto 0; 
    position:relative;
    width:750px; 
    overflow:hidden;
}

我尝试将文本对齐应用到幻灯片 div，但这没有做任何事情，我什至尝试将幻灯片 div 设置为绝对位置和文本对齐中心，但没有(与或者没有 100% 或 250 像素的宽度；)工作，它只显示图像的 10%，而且它们也没有居中。

长话短说，如何在不拉伸(stretch)细图像的情况下使图像居中？

我希望这是有道理的。

谢谢。

----已添加-----

我已经尝试使用这段代码来击败 jQuery

$(window).bind('load', function() {  
    var img_width = $("#slideshow img").width();
    $("#slideshow img").css("width", img_width);
    alert(img_width);
});

但是对于所有图像，即使是瘦图像，警报都返回 255。

我也调整了我的css

#slideshow IMG {
    position:absolute;
    top:0;
    z-index:8;
    opacity:0.0;
    text-align:center;
}

Answer 1

尝试

#slideshow img{
    ...
    left: 50%;
    margin-left: -/*half the width of the image in pixels*/; (-85px)
    ...
}