Effet de transparence avec CSS

**casawi** · 22/05/2009, 01h04

Salut
j'essaie d'ajouter un effet de transparence sur les lignes d'une table HTML.
voici mon code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css" >
	tr{
		background-color:#000099;
		color:#FFFFFF;
	}
	tr:hover{
		opacity : 0.3;
	    filter : alpha(opacity=30); 
	}
</style>
</head>
 
<body>
<table width="665" border="1">
  <tr>
    <td>aaa</td>
    <td>aaa</td>
    <td>aaa</td>
  </tr>
  <tr>
    <td>bbb</td>
    <td>bbb</td>
    <td>bbb</td>
  </tr>
  <tr>
    <td>ccc</td>
    <td>ccc</td>
    <td>ccc</td>
  </tr>
 </table> 
</body>
</html>

Sous Firefox ça marche nickel, j'obtient une couleur léger de celle du background de mes lignes, par contre sur IE7 je remarque que c'est le texte de mes lignes qui change lorsque je passe la souris sur mes lignes ??
D'après mes recherche la transparence ne fonctionne sur IE que si j'utilise la propriété filter ce que je faisais dans mon code.
Avez vous une idée sur ce problème?
Merci.

**BnA** · 22/05/2009, 14h32

Bonjour

En fait c'est relativement simple:

IE ne gère la transparence que dans 2 cas seulement :
- l’élément a une position absolue;
- l’élément a une hauteur fixe.

A toi maintenant d'adapter ton CSS!

**Macmillenium** · 22/05/2009, 14h49

Bonjour,

Je pense que le problème vient des <tr>, la transparence fonctionne correctement sur les <td>.

Effet de transparence avec CSS

CSS

Discussions similaires

Partager

Partager