html - 如何完美对齐图片？

Question

我如何完美地对齐我的图片我让它们彼此相邻，但它们比另一个略低，我无法让它们在同一条线上。除了我可以使用的相对位置之外，还有什么可以使用的吗？

这是我的代码：

#newRelises{
  width:650px;
  float:left;
  margin-left:15px;
  margin-top:5px;
}

#newRelises img{
  width:170px;
  height:170px;
  float:left;
  display:inline;
  margin-left:15px;
  margin-bottom:15px;
}

Answer 1

尝试这个：

1. 摆脱和float:left_#newRelises#newRelises img
2. 更改display:inline为display:inline-block
3. 如果您希望图像居中，请添加text-align:center到#newRelises

Answer 2

在两张图片上试试这个。

img {display:inline-block;}

更新：我看到@adaam 已经发布了一个小提琴作为评论，所以我要把它复制到这里，因为它是相同的解决方案：

http://jsfiddle.net/elvista/cKePX/2/

Answer 3

您可以添加“溢出：隐藏；” . 所以你的最终代码将是这样的：

#newRelises{
width:650px;
float:left;
margin:5px 0 0 15px;
overflow:hidden;
}
#newRelises img{
width:170px;
height:170px;
float:left;
display:block;
padding:0;
margin:0 0 15px 15px;
}