css - 如何将图像水平或垂直对齐？

Question

我知道以前有人问过这个问题——但这是一个如此简单的问题——所有的答案都太高级了……哈哈……

反正我总是卡在最简单的事情上。事情是这样的:我在右侧有两张图片，两张图片并排在下方。

位于右侧的垂直图像有效。但是，#tent 和#twins imgs 也是垂直的，我需要它们是水平的。我试过 float 属性，但它们只是垂直堆叠，一个在左边，一个在右边。

再一次...这是一个简单的问题，我知道。但我非常感谢您提供的帮助。

这是我到目前为止的代码:

#aboutUs h2{
font-size:36px;
font-family:Arial, Helvetica, sans-serif;
padding:0 0 0 0;}

#aboutusPara{
position:absolute;
float:left;
width:30%;
line-height:40px;
font-family:Arial, Helvetica, sans-serif;}

#karennorm{
width:50%;
border-radius:100px;
margin-left:50%;
position:relative;}


#wagon{
width:50%;
margin-top:5%;
margin-left:50%;
border-radius:100px;}

figcaption.aboutTop{
margin-top:.5em;
margin-left:50%;
text-align:center;
font-size:12px;
font-style:italic;
width:50%;}

#tent{
width:40%;
border-radius:100px;}

#twins{
width:40%;
border-radius:100px;}

section#aboutBottom{
padding:2em 0 0 0;} 


figcaption.aboutBottom1{
text-align:center;
font-size:12px;
font-style:italic;
width:30%;
padding:0 0 2em 0;
margin-left:5%;}

figcaption.aboutBottom2{
margin-left:5%;
text-align:center;
font-size:12px;
font-style:italic;
width:30%;}

Answer 1

通常默认情况下图像应该水平堆叠，但也许在您的代码中您更改了某些内容，因此尝试将 2 张图像水平放置在一起。

display:inline;

或

display:inline-block;

如果您想保留图像的盒模型属性。