如何完美地对齐图片？

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

您可以添加“overflow：hidden;” 。所以你的最终代码将是这样的：

#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;
}