文本不在正確的位置顯示在

用戶名不正確顯示在正確的位置。它顯示在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

文本不在正確的位置顯示在

回答

相關問題