Как удалить прозрачность из всплывающей подсказки CSS?
Это мой HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<style>
.container { margin-left: 15%; width: 70%; border: solid 1px; border-color: blueviolet;}
a.tooltip { position: relative;}
a.tooltip span em { font-style: normal; display: block; border-bottom: 1px dotted #000; }
a.tooltip span { white-space: nowrap; border: 1px solid #CCC; color: #333; padding: 5px; left: 50%; top: 0; width: auto; position: absolute; display: none; }
a.tooltip:hover span { display: block; }
a.tooltip span br { display: none;}
</style>
</head>
<body>
<div class="container">
<div>
<a class="tooltip">Hello World - now i'm online
<span>
Tooltip for Hello World1
line2
line3
</span>
</a>
</div>
<div>
<a class="tooltip">Hello soccer World - now i'm online
<span>
<img src=" http://images.all-free-download.com/images/graphicthumb/soccer_ball_clip_art_13012.jpg" alt
"Tooltip for Hello World2" width="50px" height="50px">
</span>
</a>
</div>
<div>
<a class="tooltip">Hello World3 - now i'm online
<span>
Tooltip for Hello World3
</span>
</a>
</div>
</div>
</body>
</html>
Что я уже пробовал:
opacity: 1.0; filter: alpha(opacity=100);
Но это, кажется, не работает...