18041 sujets

Questions générales et questions de débutants

Ombrage sous IE

bonjou à tous
je suis débutante et je veux réaliser un ombrage pour mon tableau aux bords arrondis, ça marche sous Firefox mais pas sous IE malgré l'utilisation de filtre; d'ailleurs l'utilisation du filtre donne l'effet d'ombrage au contenu du tableau mais pas au tableau lui même


voici mon code css:
.ombrage{
-moz-box-shadow: 8px 8px 12px #aaa;
-webkit-box-shadow: 8px 8px 12px #aaa;
box-shadow: 8px 8px 12px #555;
/* IE */
filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='gray', Positive='true');
/*IE8 */
-ms-filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='gray', Positive='true');
}

Merci

cordialement lizi87
Une page en ligne pour constater le problème pourrait être utile dans ce cas...
a écrit :
l'utilisation du filtre donne l'effet d'ombrage au contenu du tableau mais pas au tableau lui même

div ou tableau ?! je m'y perd un peu là Smiley sweatdrop
bonjour,
enfaite c'est un div appliqué à un tableau
example:
<div class=ombrage>
<table width=... height=...>
<tr>
<td>
contenu du tab
</td>
</tr>
</table>
</div>

Smiley decu
Administrateur
Hello,

Puisque c'est le tableau qui a des coins arrondis, il vaudrait mieux appliquer l'ombrage directement sur le tableau, non ?
enfaite j'ai fait un div avant le tableau, car c'est le div qui permet de faire en même temps l'arrondi et l'ombrage:
<div class="arrondi ombrage">
<table>
.
.
.</table>
</div>



merciiii Smiley decu
maintenant l'ombrage se fait pour le tableau directement (sans div), mais le problème est le même, l'ombrage se fait au contenu du tableau, mais pas au tableau lui même (sous ie) mais affichage impècable sous FF
Bonjour,

c'est un defaut ou bug recurent dans IE, qui se règle en appliquant un(e couleur de )fond en plus du filtre et parfois en forçant le layout avec zoom:1; dans les versions 7 et inferieur.

GC

<edit>pour tester:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html lang="fr">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

  <title>test ombrage IE</title>

  <style type="text/css" media="screen">
.ombrage {
-moz-box-shadow: 8px 8px 12px #aaa;
-webkit-box-shadow: 8px 8px 12px #aaa;
box-shadow: 8px 8px 12px #555;
/* IE */
filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='gray', Positive='true');
/*IE8 */
-ms-filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='gray', Positive='true');
background:white;/* ie8 */
zoom:1;/* extra ie7 et inf */
}
</style>

</head>
<body>
<p>ciblé dans un div</p>
<div class="ombrage">
<table width=200 height=300>
<tr>
<td>
contenu du tab
</td>
</tr>
</table>
</div>
<p>cible directe</p>
<table width=200 height=300 class="ombrage">
<tr>
<td>
contenu du tab
</td>
</tr>
</table>
</body></html>

Modifié par gc-nomade (24 Jan 2011 - 17:31)
Sujet clos
Aller à