css - 垂直居中对齐

Question

我有一个常见问题，尽管我无法通过在 Stack Overflow 上找到的其他解决方案来解决它。我正在尝试垂直对齐 Logo 和覆盖在高度未知的标题中的图像上的搜索栏(因为当浏览器宽度减小时图像会缩小，因为它是响应式的)

挑战是:

1. 我在一个 div block 中有一个标题图片(img，不是 CSS 背景图片)，在另外两个 div block 中有一个 Logo 和搜索栏，需要叠加在背景图片上。
2. 标题图片的大小会随着浏览宽度的减小而缩小，因为它是一个响应式网站。这意味着我不知道页眉的高度。
3. Logo 将向左浮动，搜索栏向右浮动。
4. 我需要以某种方式使 Logo 和搜索栏垂直居中，这样无论它们覆盖的标题图像的高度如何，它们始终都能很好地显示。

示例:http://www-dev.channelaustin.org/about

有什么建议吗？

Answer 1

第一个答案here ，基本上回答了你的问题。因为你只想要垂直居中，你应该删除:

top: 50%;