文本不在正确的位置显示在

用户名不正确显示在正确的位置。它显示在div元素之外。我曾尝试更改文本对齐属性，但这不起作用。我不想更改.rclick类，因为它正用于其他正常工作的元素。我怎样才能使用额外的课程？文本不在正确的位置显示在

PHP代码

echo "<div class=\"rclick\" title=\"{$user}\" style=\"width: auto;\">"; 

      if (strlen($user) > 10) 
       { 
        $user = wordwrap($user, 10); 
        $user = substr($user, 0, 10); 
       echo "Hi {$user}..."; 
       } 
       else 
       { 
       echo "Hi {$user}";    
       } 
       echo "</div>";

CSS代码

#nav .rclick { 
position: relative; 
left: 500px; 
top: 40px; 
width: 250px; 
height: 28px; 
background: url(../images/Employer.jpg) no-repeat; 
color: #FFFFFF; 
font-size: 1.14em; 
}

showing text in black color

来源

2013-04-24 Durga

如果您右键单击Chrome开发人员工具/ Firebug中的div元素并检查，是否可以发布生成的HTML？ – levelnis 2013-04-24 10:19:03

由于这是一个前端问题，你能告诉我们生成的HTML吗？ PHP并不是很有帮助。 – Jace 2013-04-24 10:19:13

Hi monika

' – Durga 2013-04-24 10:25:22

为了保证表现形式和内容的分离效果好，我建议从你的HTML标记和使用去除内联样式规则CSS来定义所有的样式声明。

由于CSS的层叠特性，HTML标记中的内联样式将覆盖HTML页面中的<style>标记中的等效声明，该标记又将覆盖外部样式表中的声明。

如果你想多个类适用于你的元素，你可以申请他们两个，像这样：

#nav .customrule 
{ 
    /*extra style definitions*/ 
}

然后在你的HTML：

<div class="rclick customrule" title="monika">Hi monika</div>

因为你相对定位的div，你可以将文本包装在一个跨度，并绝对将其放置在div中，以将其置于您需要的位置：

<div class="rclick" title="monika"><span>Hi monika</span></div> 

#nav .rclick span 
{ 
    position: absolute; 
    left: 10px; 
    top: 10px; 
}

跨度的起源将是第一个相对定位的容器，在你的情况是包含div。

我已经添加了一个jsfiddle example来说明这一点。

来源

2013-04-24 10:32:05 levelnis

我试过它使用跨度，以及何时检查浏览器中的元素，它只采用此CSS规则＃＃nav .rclick颜色：rgb（22,16,16）; font-size：1.14em; }'而不是我为跨度添加的内容，为什么会这样，我在我的问题中添加了图像以显示文本的显示方式 – Durga 2013-04-24 11:31:17

您能发布生成的HTML和所添加的所有CSS吗？最好更新你的问题，而不是发表评论 – levelnis 2013-04-24 12:33:18

它的工作，谢谢:) – Durga 2013-04-25 06:06:52

文本不在正确的位置显示在

回答

相关问题