无法将文字转到中心?

Mat*_*iyi 2 css xhtml

我有一个div缠绕在一起span并使用JS来使跨度淡入淡出(用于推荐).一切正常,除了我无法让span文本居中div.这是相关的代码:

HTML -

<div class="slideshow">
    <span style="font-size:12px; color:#333333; font-family:Lucida Grande,Lucida Sans Unicode,Calibri,Arial,sans-serif;">Hi</span>
    <span style="font-size:12px; color:#333333; font-family:Lucida Grande,Lucida Sans Unicode,Calibri,Arial,sans-serif;">Goodbye</span>
</div><br />
Run Code Online (Sandbox Code Playgroud)

这是幻灯片CSS -

.slideshow {
width:940px;
height:64px;
background-image:url(../images/quotes.png);
}
Run Code Online (Sandbox Code Playgroud)

谁能告诉我我做错了什么?哦,是的,我试过text-align:center;没有运气.

[编辑]我想补充一下,我也尝试过添加!important,没有任何变化.

tho*_*alt 5

我测试了你的代码并添加了

.slideshow {
    text-align: center; 
}
Run Code Online (Sandbox Code Playgroud)

文本中心就好了.

也许你在其他地方有一个拼写错误或css定义会覆盖你的文本对齐?

编辑

我做了一个小提琴的"检查元素",这里是我得到的CSS定义:

<div class="slideshow" style="position: relative; ">
    <span style="font-size: 12px; color: rgb(51, 51, 51); font-family: 'Lucida Grande', 'Lucida Sans Unicode', Calibri, Arial, sans-serif; position: absolute; z-index: 3; top: 0px; left: 0px; display: block; width: 13px; height: 15px; opacity: 0.275808; ">Hi</span>
    <span style="font-size: 12px; color: rgb(51, 51, 51); font-family: 'Lucida Grande', 'Lucida Sans Unicode', Calibri, Arial, sans-serif; position: absolute; top: 0px; left: 0px; display: block; width: 52px; height: 15px; z-index: 2; opacity: 0.724192; ">Goodbye</span>
</div>

element.style {
    color: #333;
    display: block;
    font-family: 'Lucida Grande', 'Lucida Sans Unicode', Calibri, Arial, sans-serif;
    font-size: 12px;
    height: 15px;
    left: 0px;
    opacity: 1;
    position: absolute;
    top: 0px;
    width: 52px;
    z-index: 3;
}
Run Code Online (Sandbox Code Playgroud)

我会说"display:block"是你的问题.

  • 显然,它应该起作用.但是在他的情况下(我认为这是@David Dorward在他对自己答案的评论中提出的观点).这也是我要求OP在某个地方发布现场演示的原因,所以我们可以尝试找出它在其他地方的原因,这会导致他的问题. (2认同)