我如何将文本置于我的css div圈内

时间:2014-04-15 03:11:22

标签: css

这是我的css

.circle{
 border-radius:50%;
 border:5px solid black;
 width:100px;
 height:100px;
 box-shadow: 0 0 5px 2px rgba(0,0,0,.35);
 font-family:Century Gothic;
 color:black;
 text-align:center;

 }

.circle:hover{
background-image:url(../images/stardust.png) ; 
 color:#FCB326;
 border:5px solid #56a7ba;
}

如何制作圆圈的文字中心?我尽力使它居中但仍然失败。     enter image description here

1 个答案:

答案 0 :(得分:5)

使用display: table-cell; + vertical-align: middle;

Fiddle

.circle {
    border-radius:50%;
    border:5px solid black;
    width:100px;
    height:100px;
    box-shadow: 0 0 5px 2px rgba(0, 0, 0, .35);
    font-family:Century Gothic;
    color:black;
    text-align:center;
    display: table-cell;
    vertical-align: middle;
}