两个内联divs(PC)，在媒体上具有垂直中心对齐

Question

我正在尝试为页面设计一个TopBar（2个内联divs），而我在将它们垂直集中在媒体屏幕上时遇到了麻烦。

（油漆）我想做的

我正在使用 float: left;来使div inline display: inline-block用于 li 元素，并且效果很好，但它可以使它们在媒体屏幕上进行内联。

任何帮助将不胜感激！

Answer 1

是可以通过媒体查询解决的（这些允许您根据屏幕大小更改元素的CSS状态）：

）：

@media only screen and (max-width: 1280px) {
.your-class-here {
display: block;
}
}

记住将相关的元标记也添加到您的HTML头部元素：

<meta name="viewport" content="width=device-width, initial-scale=1">

欢呼

Marky

Answer 2

CSS中的垂直中心很难 - 我建议使用Flexbox解决这种问题-https：//css-tricks.com/snippets/css/css/a-guide-to--flexbox/