相关疑难解决方法(0)

我有一个按钮,旁边有一些文字,像这样,

----------------
|              |
|    Button    |     Text
|              |
----------------

我希望文本垂直对齐按钮的中心.我应该如何在CSS中执行此操作？

这是我的尝试:

http://jsbin.com/oduma4/4

我发现这种方法存在两个问题:

1. 文本显示在IE 6的顶部.
2. 这两个元素流出父div,因此这种布局会干扰其他div.

我有这个div:

HTML:

<div draggable="false" id="coffe">Free coffee</div>

CSS:

div {
    position: absolute;
    overflow: auto;
    text-align: left;
    font-size: 23px;
    color: rgb(26, 66, 108);
    font-family: roboto, Helvetica;
    font-style: normal;
    font-weight: bold;
    -webkit-transition: none;
    transition: none;
    left: 0px;
    top: 67.125px;
    width: 1029.25px;
    height: 234.93749999999997px;
    opacity: 1;
    background: grey;
}

我需要垂直居中,这是"免费咖啡".

我怎样才能做到这一点？我试过vertical-align: middle;但它不起作用.

这是小提琴文件:http://jsfiddle.net/2Mb39/