将动态文本置于CSS中心
我从我的Icecast服务器收到歌曲标题,并且总是根据播放列表进行更改。将动态文本置于CSS中心
显然有些标题比其他标题长,反之亦然。
我试图将文本居中放在那个盒子里,所以它总是适合在中间,不管标题的长度。
我该如何做到这一点?
的DIV + CSS:
.now_playing div {
white-space:nowrap;
font-size:13px;
line-height:24px;
position: relative;
min-height: 30px;
padding-left: 100px;
text-align: center;
right: 36px;
}
锚CSS:
.now_playing a {
font-family: HelveticaNeue-Light, "Helvetica Neue Light", "Helvetica Neue", sans-serif;
font-size: 12px;
color: #fff;
text-decoration: none;
position: absolute;
top: 50%; left: 0;
width: 90px;
height: 30px;
margin-top: -15px;
}
您可以套用这个规则
.now_playing a {
display: block;
width: 100%;
}
并从.now_playing div
选择器中删除padding-left: 100px;
。
但是它跨越了整个宽度,我想他只是希望文本是可点击的,即一个标记居中在div? – imperfectinfinity
是的,我认为歌曲标题跨越整个宽度。所以用短标题歌曲,用户将很容易在歌曲之间切换。 –
你的解决方案工作...我试图将文本居中作为歌曲标题的变化,但它太长了......使用你的规则,并降低字体大小似乎解决了这个问题,在5分钟内接受错误 – TonalDev
只需从标记中移除绝对位置即可。 – imperfectinfinity
你试过了.now_playing {margin:0 auto; }而不是左:0 – Tdelang