CSS：如何將提示框（a：懸停）移動到左側？

Question

我在箱子提示，至極都犯了這樣的：

CSS代碼：

a span 
{ 
    display:none; 
} 
a:hover span 
{ 
    position:fixed; 
    display:inline; 
    border: 1px solid #0000FF; 
    margin: 0px 0px 0px 10px; 
    padding: 5px; 
    color: #000000; 
    background: #faffc3; 
    opacity:.90; 
} 

HTML代碼，提示是跨度之間標籤和內部一個元素：

<div> 
    Some text, 
    <a href="#">link<span>Hint.<br>Second line of hint.</span></a> 
    , some text, and another 
    <a href="#">link<span>Hint</span></a>. 
</div> 

是否可以通過使用某些CSS屬性將提示框從鏈接的右側（默認位置）移動到左側？

PS。對不起我的英語不好。

Answer 1

a { 
    position:relative; 
} 

a span 
{ 
    display:none; 
} 
a:hover span 
{ 
    position:absolute; 
    display:inline; 
    border: 1px solid #0000FF; 
    margin: 0px 0px 0px 10px; 
    padding: 5px; 
    color: #000000; 
    background: #faffc3; 
    opacity:.90; 
    right:0; 
    margin-right: 105%; 
} 

DEMO

Answer 2

您需要根據您的要求設置保證金餘額。

a:hover span 
{ 
    margin-left:-10px; 
} 

見例如

http://jsfiddle.net/dSd2a/3/

Answer 3

我認爲這段代碼會爲你工作：

a{ 
    position: relative; 
} 

a:hover span{ 
    position: absolute; 
    right: 100%; 
} 

跨度將有右邊框觸及<a>的左邊框。如果您爲跨度定義寬度，這會更好。

jsFiddle