<分区>
html - 垂直对齐元素以匹配相邻元素的中线
我有一个按钮，一个 div 和一个 span 在一行中彼此相邻
我需要它们都像这样垂直对齐中心
下面是我的代码
button{
height: 50px;
}
div{
display: inline-block;
height: 70px;
border: 2px solid black;
padding: 10px;
}
h1{
display: inline-block;
}<div></div>
<button>Button</button>
<span>Span</span>
<div>div</div>最佳答案
在这种情况下，我建议使用 flex for。
如果将容器包裹在元素周围，则可以将子元素居中对齐。有关示例，请参见代码段。
button{
height: 50px;
}
.container div{
display: inline-block;
height: 70px;
border: 2px solid black;
padding: 10px;
}
h1{
display: inline-block;
}
.container {
display:flex;
align-items:center;
}<div class="container"><div></div>
<button>Button</button>
<span>Span</span>
<div>div</div>
</div>希望对您有所帮助。
关于html - 垂直对齐元素以匹配相邻元素的中线，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/49028729/