我很难找到我的情况下的具体信息。我想在940像素的div上分配3张图片缩略图，以便与我的其他内容对齐。到目前为止，我已经得到了水平排列的图像，但间距是关闭&一切都向左移动。
这里是我的CSS：
#thumbs {
width: 940px;
margin-top:90px;
margin-left: auto;
margin-right: auto;
}
我的HTML：
<div id="thumbs">
<a id="single_image" href="/dev/images/1.png">
<img src="/dev/images/thumb1.png" alt=""/>
</a>
<a id="single_image" href="/dev/images/2.png">
<img src="/dev/images/thumb2.png" alt=""/>
</a>
<a id="single_image" href="/dev/images/3.png">
<img src="/dev/images/thumb3.png" alt=""/>
</a>
</div>
示例图像
我目前有：
我想实现：
您的帮助非常感谢。
解决方法
使用在我的答案在这里显示的技术：
Fluid width with equally spaced DIVs
这里是你的代码：http://jsfiddle.net/thirtydot/JTcGZ/
CSS：
#thumbs {
width: 540px;
margin-top:90px;
margin-left: auto;
margin-right: auto;
text-align: justify;
-ms-text-justify: distribute-all-lines;
text-justify: distribute-all-lines;
}
#thumbs a {
vertical-align: top;
display: inline-block;
*display: inline;
zoom: 1;
}
.stretch {
width: 100%;
display: inline-block;
font-size: 0;
line-height: 0
}
HTML：
<div id="thumbs">
<a id="single_image1" href="#"><img src="http://dummyimage.com/150x150/444/fff" alt=""/></a>
<a id="single_image2" href="#"><img src="http://dummyimage.com/150x150/444/fff" alt=""/></a>
<a id="single_image3" href="#"><img src="http://dummyimage.com/150x150/444/fff" alt=""/></a>
<span class="stretch"></span>
</div>
