中心在div中对齐锚文本

时间:2012-08-27 18:43:53

标签: html css

我搜索了这个,但没找到解决办法。 我有一个带文字的锚。

锚点的高度和宽度由JS在DOM负载上设置 我需要锚中的文本垂直和水平居中。

遵循许多关于居中元素的教程。他们都没有工作。

这是我的HTML

<a href="#" class="wpsc_category_grid_item" title="Category1">
    <span>Category1</span>
</a>

我的CSS

.wpsc_category_grid_item {
    background: #000;
    margin:1px;
    float:left;
    text-align: center;
    display:table;
}

.wpsc_category_grid_item span{
    display: table-cell;
    vertical-align: middle;
    width:100%;
    height:100%;
    color:#fff;
    text-align: center;
    font-weight: bold;
    text-decoration: none; 
}

我需要这些文本,垂直居中......

enter image description here

1 个答案:

答案 0 :(得分:2)

我用你的代码制作了js fiddle。我添加

之后就可以了
width: 100%;
height:100%;

.wpsc_category_grid_item