28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Cela fait un petit bout de temps que je parcours avec plaisir les tutos sur alsacreations, et aujourd'hui je me retrouve dans une impasse qui m'oblige à poster mon premier message.

La source de mes ennuis est, pour changer, IE (v.8).

Mon but est assez simple : obtenir une boite avec du texte dedans et une couleur avec une certaine opacité en utilisant RGBa, à la manière du tuto de cette page : http://www.alsacreations.com/xmedia/tuto/exemples/transparence/rgba.html

Pour éviter la transparence sous IE8, mais avoir un fond de couleur, j'ai rajouté au code de la page le code suivant :
div { 
  background-color: rgb(0, 0, 255); 
  background-color: rgba(0, 0, 255, 0.5); 
}


Quand j'ouvre la page en local, aucun problème sous IE ou firefox (fond à moitié transparent sous firefox, remplacé par le fond opaque sous IE).
Tout change quand je publie la page sur mon serveur, l'affichage est bon sous firefox mais je perds le fond coloré sous IE...
Qu'est-ce qui peut expliquer ces différences, juste en publiant la page ? Sachant que j'ai gardé la page telle quelle, aucun ajout par rapport au tuto, sauf le code indiqué ci-dessus...

Merci pour toute aide!
Bonne journée,
Il faut ajouter cette condition a div et mettre le code la couleur voulu

<!--[if IE]>

   <style type="text/css">

   div{
       background:transparent;
       filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#0000FF50,endColorstr=#0000FF50);
       zoom: 1;
    } 

    </style>

<![endif]-->


Bonne journée
Modifié par foued (24 Jan 2011 - 12:49)
Merci pour cette réponse.

En effet rajouter le filtre pour gérer la transparence permet de s'affranchir du problème.

Mais est-on vraiment obligé de rajouter ce filtre, même si le but était seulement d'afficher la boite colorée sans transparence sous IE ?

D'ailleurs je ne comprends toujours pas pourquoi il y a une différence d'affichage entre la page lue localement et celle publiée... Il y a également des changements dans les tailles des marges de la page et de la boite.

Si quelqu'un pouvait m'éclairer sur ce problème, ça me débloquerait les neurones! Sinon, je me contenterai d'utiliser le filtre pour IE...

Merci!