在div内的链接内对齐文本

Question

我已经尝试了很长时间。但是我无法在div内的链接内对齐文本的一部分。 这听起来确实令人困惑。 这是我所拥有的一个例子：

http://jsfiddle.net/caoj5c36/

如您所见，当您在“ Pygame”上滚动时，我希望“ Coming Soon ..”的描述在按钮内居中。

有什么建议么？

我尝试使用

text-align: center;

在我的css脚本中html标记的所有可能组合中

Answer 1

这是因为p是绝对定位的。 这使得它用完要素的流动。所以，你必须让它扩大到母公司的宽度为100％ a ，然后你可以使用text-align: center

更新了JsFiddle

#button_layout #info_text {
    /*description is invisible until hover */
    font-size: 16px;
    visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
}

Answer 2

这很简单：

#button_layout #info_text { 
    width: 100% 
}

因此，您的链接具有div的宽度，以使文本居中。

您不应该使用这样的ID。 ID只能在页面上使用一次，而应使用类。