中心垂直对齐

Question

我有一个常见的问题，虽然我无法使用Stack Overflow上的其他解决方案来解决它。我正在尝试垂直对齐徽标和覆盖在图像中的搜索栏在未知高度的标题中（因为当浏览器宽度减小时图像缩小，因为它响应）

挑战是：

1. 我在一个div块中有一个标题图像（img，而不是CSS背景图像）和徽标＆amp;搜索栏中需要覆盖在背景图像上的另外两个div块。
2. 当浏览宽度减小时，标题图片的大小会缩小，因为它是一个响应式网站。这意味着我不知道标题的高度。
3. 徽标将向左浮动，搜索栏向右浮动。
4. 我需要以某种方式将徽标和搜索栏垂直居中，这样它们总能很好地显示，无论它们叠加在哪个标题图像的高度上。

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

有什么建议吗？

Answer 1

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

top: 50%;