将图像居中对齐

【问题标题】：Aligning Image to center将图像居中对齐
【发布时间】：2017-03-28 02:24:14
【问题描述】：

很难将三个图像放在各自盒子/容器的底部中心，而不会溢出到黄色背景的边缘。网址link

【问题讨论】：

【解决方案1】：

移除高度

.feedback-box .client {
    margin-top: 30px;
/*  height: 73px; */
    position: relative;
}

删除浮动，添加边距：0 auto;

.feedback-box .client-image {
    /*  float: right; */
    width: 150px;
    height: 100px;
    padding: 5px;
    border: 4px solid #ececec;
    margin: 0 auto;
}

【讨论】：

【解决方案2】：

删除float 并将margin: 0 auto 添加到.client-image 类：

.feedback-box .client-image {
    /*  float: right; Remove this or float:none */ 
    width: 150px;
    height: 100px;
    padding: 5px;
    border: 4px solid #ececec;
    margin: 0 auto;
}

并将margin-bottom 添加到.feedback-box .client

.feedback-box .client {
    margin-top: 30px;
    height: 73px;
    position: relative;
    margin-bottom: 20px;
}

【讨论】：