[英]Aligning text inside a link, inside a div
I have been trying for a long time.. But I can not align a section of text inside a link, which is inside a div. 我已经尝试了很长时间。但是我无法在div内的链接内对齐文本的一部分。 This may sound really confusing. 这听起来确实令人困惑。 This is an example of what I have: 这是我所拥有的一个例子:
http://jsfiddle.net/caoj5c36/ http://jsfiddle.net/caoj5c36/
As you can see when you scroll over "Pygame" I want the description "Coming Soon.." to be centered inside the button. 如您所见,当您在“ Pygame”上滚动时,我希望“ Coming Soon ..”的描述在按钮内居中。
Any suggestions? 有什么建议么?
I have tried using 我尝试使用
text-align: center;
in every possible combinations of html tags in my css script 在我的css脚本中html标记的所有可能组合中
It's because p
is absolutely positioned. 这是因为p
是绝对定位的。 It makes it run out of the flow of the elements... So, you'll have to make it expand to 100% width of the parent a
, and then you can use text-align: center
这使得它用完要素的流动。所以,你必须让它扩大到母公司的宽度为100% a
,然后你可以使用text-align: center
#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;
}
Its simple: 这很简单:
#button_layout #info_text {
width: 100%
}
So your Link has the width of the div to center the text in it. 因此,您的链接具有div的宽度,以使文本居中。
You shouldn't use IDs like this. 您不应该使用这样的ID。 IDs should only be used once on a page, use classes instead. ID只能在页面上使用一次,而应使用类。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.