28172 sujets

CSS et mise en forme, CSS3

Css et tableau IE8 déraille ...

hello a tous voila à cette url
http://www.le-bijou.net/newbijou/index.php?option=com_flexicontent&view=category&cid=68&Itemid=65
sous FireFox c'est nikel
Mais sous IE c'est la cata la premiere colonne est de la couleur de la premiere ligne, la coloration des ligne (1 sur 2) ne fonctionne pas .....
voici mon css
div#flexicontent table.flexitable tr:hover td, div#flexicontent table.flexitable tr:hover th { 
color:#660000;
background-color:#FFCC33;
}
div#flexicontent table.flexitable th {
background-color: #660033;
color: #ffffff;
font-weight: bold;
text-align:center;
}
.sectiontableentry1{
background-color:#FFE375;
color:#660000;
}
.sectiontableentry2 {
color:#660000;
}
div#mp3{
	width:80%;
}

si qqu'un pouvais m'aider ?
Merci par avance
Bonsoir.

Alors tout d'abord, IE ne reconnait la pseudo-classe :hover QUE sur les liens. Donc pas sur les TR.

Ensuite, tes classes sectiontableentry1 et sectiontableentry2 sont également appliquées sur tes TR.
La modification suivante devrait résoudre ton soucis sous IE :

.sectiontableentry1 th, .sectiontableentry1 td {
background-color:#FFE375; 
color:#660000;
}

//...



++
re j'ait la modif mais la ca m'enlève les style sur les lignes ....

div#flexicontent table.flexitable tr:hover td, div#flexicontent table.flexitable tr:hover th { 
color:#660000;
background-color:#FFCC33;
}
div#flexicontent table.flexitable th {
background-color: #660033;
color: #ffffff;
font-weight: bold;
text-align:center;
}
.sectiontableentry1 th, .sectiontableentry1 td{
background-color:#FFE375;
color:#660000;
}
.sectiontableentry2 {
color:#660000;
}


c'est bizarre pour les :hover sur les liens car ca fonctionne quand même le survol ....
une autre idée ?
Merci
Bonsoir,

Utilise le fichier csshover.htc, voir ici pour son téléchargement et son utilisation.
Modifié par jQz (01 Dec 2009 - 21:15)
hello je l'ai installer mais toujour ce probleme de colone 1 qui prend la couleur marron et pas de couleur une colone sur 2 ...
peus tu me confirmer ?
Merci
devzonefr a écrit :
Alors tout d'abord, IE ne reconnait la pseudo-classe :hover QUE sur les liens.

Faux. Il serait temps de mettre à jour ces notions datant de quelques années. Smiley cligne

Pour être précis: cette limitation ne concerne que la version 6. Les versions 7 (sortie en 2006) et 8 (sortie en 2009) ont un support globalement correct de la pseudo-classe :hover.

Par contre, plusieurs navigateurs ont quelques soucis avec la mise en forme des éléments TR. Donc il se peut que le tr:hover passe mal y compris dans IE8. Autre piste possible: si la page s'affiche en mode de compatibilité IE7 ou en mode Quirks. À vérifier (outils pour développeur d'IE8).

jQz a écrit :
Utilises le fichier csshover.htc

Pas mieux. L'article que tu indiques est tout aussi daté que la remarque de devzonefr. Appliquer ses recommandations aujourd'hui, en 2009, serait une bêtise.

De manière générale, tous les articles qui parlent du support de telle ou telle fonctionnalité dans «IE», sans préciser la version, commettent la même erreur que les développeurs qui créaient des sites pour IE6 sans se préoccuper du reste (ou à la rigueur d'IE5).

PS: pas de S final à «utilise ceci» (impératif présent des verbes du premier groupe).
Modifié par Florent V. (01 Dec 2009 - 13:46)
yberges a écrit :
hello je l'ai installer

Tu peux l'enlever.
Modifié par Florent V. (01 Dec 2009 - 13:47)
ok merci mais quelqu'un a t il infos du pourquoi IE m'affiche cette colonne en marron et pas les css des colonnes alors que firefox n'as aucun soucis .... je voudrais bien trouver la solution.
Merci par avance de votre aide
yberges a écrit :
ok merci mais quelqu'un a t il infos du pourquoi IE m'affiche cette colonne en marron

Je n'ai pas de réponse exacte (et pas IE sous la main pour tester). Cependant j'ai mentionné deux pistes que tu n'as pas explorées:
- Un affichage en mode de compatibilité plutôt qu'en mode natif IE8.
- Une limite sur les effets de :hover spécifiquement pour les éléments TR.

Je te laisse voir ça.
hello j'ai dejà le site en mode compatibilité
l'effet hover n'ai pas ma priorité mais plutôt que les 2 tableau soient identique c'est à dire que la première colonne ne soit pas marron sous ie et qu'une ligne sur 2 soit orange .. d'apres mes css ca marche sous ff mais pas sous ie ... le hover marche sous ie8 et ie7 donc je n'ai aucun soucis de ce coté
A suivre
a écrit :
Pas mieux. L'article que tu indiques est tout aussi daté que la remarque de devzonefr. Appliquer ses recommandations aujourd'hui, en 2009, serait une bêtise.

De manière générale, tous les articles qui parlent du support de telle ou telle fonctionnalité dans «IE», sans préciser la version, commettent la même erreur que les développeurs qui créaient des sites pour IE6 sans se préoccuper du reste (ou à la rigueur d'IE5).

PS: pas de S final à «utilise ceci» (impératif présent des verbes du premier groupe).


Arf, je suis désolé, je ne savais pas que cette méthode était à proscrire.
Merci de m'avoir rectifié mon erreur et merci Florent V. pour la correction de conjugaison Smiley cligne .
Sujet clos
Aller à