html - 底部对齐图像

Question

我试图将最后两张图像与第一张图像对齐到底部，但没有成功。

.image-wrap img {

width:100%;
height:auto;
positon:absolute;
display:inline-block;
vertical-align: bottom;
display: table-cell;}

.image-wrap {

text-align:center;
width: 100%;
height:auto;
position: relative;
vertical-align: bottom;

代码:http://jsfiddle.net/uvh7w/

Answer 1

在 CSS 末尾添加以下行:http://jsfiddle.net/RrLx7/ .这个解决方案更像是一个补丁。对于更全面的方法，您的大部分代码将需要进行一些大修。我会把它留给你去做。

[class*='col-'] {
    float: none;
    padding-right: 20px; 
}

#hehe > .grid.grid-pad {
    display: table;
    width: 100%;
}

#hehe > .grid.grid-pad > * {
    display: table-cell;
    outline: 1px solid blue;
}