CSS：沿图像底部对齐图像

我试图沿着它们的底部边缘对齐3个图像，使它看起来干净平整。我在一个Div中有3个图像，Div在一个区域内。该部分相对定位，Div定位为绝对，底部为0，因此图像保留在页面底部的页脚上方。CSS：沿图像底部对齐图像

如何获得图像的底边对齐，就好像在一条平线上一样？

注意*：忽略内联样式，图像不匹配，所以我不得不内联样式来修复它们。

HMTL：

<section> 
    <div class="logo-footer"> 
     <img style="width: 100px; margin-right: 40px" src="google.com/images/srpr/logo11w.png"/> 
     <img style="width: 500px; height: 75px; " src="google.com/images/srpr/logo11w.png"/> 
     <img style="width: 250px" src="google.com/images/srpr/logo11w.png"/> 
    </div> 
</section>

CSS：

.logo-footer { 
display: -webkit-flex; 
display: flex; 

-webkit-flex-direction: row; 
flex-direction: row; 

-webkit-justify-content: center; 
justify-content: center; 

-webkit-align-self: center; 
align-self: center; 

height: 115px; 

position: absolute; 
bottom: 10px; 
} 

.logo-footer img{ 
margin: 0 50px; 
}

来源

2015-08-18 blackRob4953

您的图片有本地路径，并且此处不加载 –

只需用https://www.google.com/images/srpr/logo11w.png – Zack

替换本地路径[DIV容器中的HTML图像底部对齐] （http://stackoverflow.com/questions/6520940/html-image-bottom-alignment-inside-div-container） – Zack

设置部分position:relative和DIV position:absolute，倒挂你做到了。然后设置div底部：0px或任何你需要的。

来源

2015-08-18 22:09:04

如果我翻转这两个图片，则图片会保留在该段落下方，并存在空白区域，直到页脚出现为止。如果我保持原样，图像沿着底部对齐，但图像的底部位于不同的水平上，它们并不坐在一条线上。 – blackRob4953

是的，这是一个重复的问题 –

CSS：沿图像底部对齐图像

回答

相关问题