2011-11-24 68 views
0

請看這個例子http://jsfiddle.net/7trcV/ 我想要實現的是能夠將任意圖標放在文本的右側,文本寬度是有限。在這個例子中,我發佈了第二個問題(短文本) - 圖標顯示爲與文本分離。css文本右邊的圖標在正確的回退溢出

任何幫助表示讚賞!

+1

所以你想顯示圖標旁邊的文字或我錯了..?我想我沒有得到這個問題... – Gatekeeper

+0

是的,你理解它是正確的。 – atamur

回答

1

這是怎麼回事? http://jsfiddle.net/7trcV/5/

我給了.content一個正確的填充和設置圖標作爲它的背景。


好吧,試試這個http://jsfiddle.net/7trcV/6/它應該已經整理出你的下劃線問題。我沒有解決可點擊圖標,因爲這與您的原始問題完全不同。

+0

謝謝,不幸的是,一些故障(沒有下劃線懸停在鉻中,ff3.6中的雙下劃線,ff3.6中的圖標周圍亂七八糟等)+不允許我在最後放置單獨的可點擊圖標(這也是其中一個用例) – atamur

+0

它在ff3.6中仍然是一團糟,但這是我猜測的最好的事情 – atamur

0

您可以使用javascript來查找跨度的寬度,並在其旁邊顯示圖標位置。

〔實施例在這裏:http://jsfiddle.net/peduarte/KCttp/

+0

如果可能,我寧願避免js – atamur

+0

是的,嘗試避免js總是很好。不過,我認爲沒有它就不可能實現你想要的。就個人而言,我認爲它總是在右邊看起來更好。 – peduarte

1

好抱歉,我沒有你的代碼看起來正確的,第一次在這裏...問題是絕對定位的圖標,這就需要下一個要被漂到你的跨度是這樣的:jsfiddle link

當你這樣做後,你必須設置該跨度的最大寬度爲圖標的容器寬度的寬度......希望這會有所幫助

+0

對不起,現在我不太明白你的答案。 .content已經內聯塊,設置它阻止不會改變任何東西給我 – atamur

+0

你設置最大寬度:160px;內容,但我不能這樣做,因爲我不知道絕對寬度不幸的 – atamur

+0

,但你有那些包裝divs 200px寬...所以你知道有200px-iconwidth space文本或不是? – Gatekeeper