中心垂直的div的内容 [英] center vertically the content of a 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;
}

我需要垂直居中其内容，这是免费咖啡。

And I need to vertically center its content, which is "free coffee".

我该如何做？我尝试用 vertical-align：middle; 但它不工作。

How can I do this? I tried with vertical-align: middle; but it doesn't work.

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

推荐答案

指定与< div> 匹配的 line-height s height：

Specify a line-height that matches the <div>'s height:

line-height: 235px;

查看此 jsFiddle演示

这篇关于中心垂直的div的内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！