导航栏中浮动文本的CSS垂直居中

我正在尝试用html+css创建一个导航栏，看起来像以下链接中的图像：

---

基本上，我在左浮动矩形/div中有一些大文本（灰色），在右浮动矩形/div中有一个小字体的链接列表（红色），我希望该文本垂直居中，而不必去除浮动并调整灰色和红色框的左/右边距。这可能吗？如果可能，怎么做？

如果你知道红色容器的高度，那么这很容易。按以下方式设置HTML：

<div class="red">
    <a href="Home">Home</a>
    <a href="...">...</a>
    <a href="etc.">etc.</a>
</div>

---

看看这个！希望有帮助！：

在div中垂直添加文本似乎很难

诀窍在于以下几点

假设以下HTML：

<div id="parent">
<p id="child"> text</p>
</div>

这样做会导致以下结果。

---

如果您能分享您迄今为止所做的工作，我将非常有帮助。请查看此…：

<div id="parent">
<p id="child"> text</p>
</div>

#parent{
    display: table;
    ....
 }

 #child{
    display: talble-cell;
    vertical-align: center;
 }