如何使用css将文本垂直居中在圆形div中

时间:2015-04-23 03:27:25

标签: html css geometry

我想知道我在css中忽略了什么,这会阻止文本垂直居中?以下是我当前的代码and here is a fiddle

这是我的HTML

.donateButton {
width:100px;
height:100px;
background-color:#FE6D4C;
-moz-border-radius: 50px;
-webkit-border-radius: 50px;
border-radius: 50px;
margin:0 auto 30px;
text-align:center;
}
.donateButton:hover {
background-color:#09C;
}
.donateButton a {
display:block;
width:100%;
color:#FFFFFF;
font-size:1em;
text-decoration:none;
padding-top:50%;
line-height:1em;
margin-top:0.5em;
}

这是我的CSS

func buttonAction(sender: UIButton) {
    var indexPath:NSIndexPath = NSIndexPath(forRow:sender.tag, inSection: 0)
    var cell = tableView.cellForRowAtIndexPath(indexPath) as! CustomCell
    cell.centerLabel.hidden = false
}

提前感谢任何见解。

我也想最终做出这个响应,但我猜这将是另一个问题:)

2 个答案:

答案 0 :(得分:0)

如果您确定文本只是一行,则可以执行此操作:

.donateButton a {
    display:block;
    width:100%;
    color:#FFFFFF;
    font-size:1em;
    text-decoration:none;
    line-height:100px;
}

答案 1 :(得分:0)

最简单的方法是从文本中删除填充顶部,并将行高设置为100px,与div的高度相同。