我是CSS和HTML的初学者所以我确定这是一团糟.但我正在尝试做的是将3个图像并排放置在CSS的水平中心.我尝试过不同的解决方案让它们正确对齐,但它们仍然停留在页面的左侧或者堆叠在彼此之上(有时重叠).
我的CSS：
#imagesMain{
display: inline-block;
position:relative;
padding: 0;
margin-left:auto;
margin-right:auto;
margin-top: 20px;
text-align:center;
}
#imagesMain img{
height: 400px;
width: 300px;
vertical-align: center;
}
默认情况下,图像很大.第二个CSS块调整它们的大小,但我不能让它们做其他事情.有任何想法吗？
最佳答案
您可以使用几乎相同的CSS,但通过一个简单的更正,更改：
vertical-align: middle;
并删除这些：
display: inline-block;
position: relative;
这里没有中心.它必须是中间的.请更正它.并从< div>中删除display：inline-block.你的最终代码应该是：
#imagesMain {
padding: 0;
margin-left: auto;
margin-right: auto;
margin-top: 20px;
text-align: center;
}
#imagesMain img {
height: 400px;
width: 300px;
vertical-align: middle;
}
单击“运行代码段”并按“整页”以检查这是否是您所期望的.
原文链接：https://www.f2er.com/css/426953.html
