[résolu] Validation des css, il faut toujours le background ?

bonjour,
J'ai testé les validateurs de css pour 2 des mes sites.
j'ai obtenu les felicitations (au moins je les ai la )

mais dans "avertissements" juste en dessous j'ai pleins de fois

a écrit :

# Ligne : 3 (Level : 1) Vous n'avez pas de couleur de fond définie avec votre couleur : a:link
# Ligne : 4 font-family: Vous êtes encouragés à proposerune famille générique comme dernier choix
# Ligne : 9 (Level : 1) Vous n'avez pas de couleur de fond définie avec votre couleur : a:visited
# Ligne : 10 font-family: Vous êtes encouragés à proposer une famille générique comme dernier choix
# Ligne : 15 (Level : 1) Vous n'avez pas de couleur de fond définie avec votre couleur : a:active
# Ligne : 16 font-family: Vous êtes encouragés à proposer une famille générique comme dernier choix
# Ligne : 21 (Level : 1) Vous n'avez pas de couleur de fond définie avec votre couleur : a:hover
# Ligne : 22 font-family: Vous êtes encouragés à proposer une famille générique comme dernier choix
# Ligne : 29 (Level : 1) Vous n'avez pas de couleur de fond définie avec votre couleur : p
etc...

et ceci quelque soit la balise : a p etc...

faut-il systématique mettre un background-color pour tous les éléments?
le fait (par ex pour une page "normale") de le mettre dans le body ou dans le selecteur universel * n'est pas suffisant ?

merci pour votre réponse.
a+
Modifié par Angelik (05 May 2006 - 11:58)

Bonjour,

On conseille d'utiliser une couleur de fond dès qu'on utilise "color", car même si le site se comporte bien en temps normal, n'avoir pas de couleur de fond peut le rendre illisible dans certains cas : sur un texte agrandit par l'utilisateur avec son navigateur, si on désactive les images qui habillent du texte, etc.

Donc oui, il faudrait le mettre partout. Ça peut quelquefois poser problème, lorsque par exemple le fond d'un bloc div est une image (ou une texture) : on peut utiliser dans ce cas un "background-color: transparent", mais ça génère toujours un avertissement sur le validator CSS. C'est quand même bon compromis.

Je ressort une image :

http://www.univers-fusco.com/tests/background.jpg
Modifié par (05 May 2006 - 11:03)

merci pour ta réponse rapide.
je vais donc mettre background sur toutes les class

a+

Concernant les autres avertissements, il suffit de mettre "sans-serif" derrière les listes de polices sans empattements (verdana, arial, helvetica, etc.), et serif pour les autres (times, georgia, garamond, etc.).

font-family: Verdana, Arial, Helvetica, [#orange]sans-serif[/#];
font-family: Georgia, "Times New Roman", Times, [#orange]serif[/#];

neko a écrit :
Concernant les autres avertissements, il suffit de mettre "sans-serif" derrière les listes de polices sans empattements (verdana, arial, helvetica, etc.), et serif pour les autres (times, georgia, garamond, etc.).

font-family: Verdana, Arial, Helvetica, [#orange]sans-serif[/#];
font-family: Georgia, "Times New Roman", Times, [#orange]serif[/#];

en effet j'ai aussi ces remarques, mais justement le "sans serif" est present mais il interprete comme si c'etait une police et me demande de mettre les nom avec espace entre guillement ou alors m'indique que le dernier terme (sans serif) n'est pas une police generique...

(edit: autant pour moi, je n'avais pas mis le "-")


sinon maintenant que j'ai mis les background partout...

dans un id d'un div ou il n'y a pas de texte :

ex :

#banner {
    height: 286px;
    background-color: #ffffff;
    width: 800px;
    padding: 0;
	} 

donc faut-il mettre systematique color partout meme s'il n'y a pas de texte?
a+
Modifié par Angelik (05 May 2006 - 11:22)

Astuce : puisqu'il faut mettre une valeur à background-color dès qu'on utilise une couleur de texte, on peut tirer profit de l'héritage de CSS2.

En effet, et sauf indication contraire, tout élément hérite des couleurs de fond/écriture de son parent.
On peut donc utiliser sans souci ceci :

background-color: inherit;
color: inherit;

Ce qui évite de recopier les valeurs et de faire des erreurs
Modifié par Ladytron (05 May 2006 - 11:22)

Ladytron a écrit :
Astuce : puisqu'il faut mettre une valeur à background-color dès qu'on utilise une couleur de texte, on peut tirer profit de l'héritage de CSS2.

En effet, et sauf indication contraire, tout élément hérite des couleurs de fond/écriture de son parent.
On peut donc utiliser sans souci ceci :

background-color: inherit;
color: inherit;

Ce qui évite de recopier les valeurs ...

très bonne remarque
merci
Modifié par Angelik (05 May 2006 - 11:26)

Dans ce cas là :

background-color: inherit;
color: inherit;

autant supprimer ces deux lignes qui ne servent à rien si un élément hérite correctement des propriétés
de son parent ?!
Plus de "color" -> plus de "background-color" -> plus d'avertissement.
Modifié par (05 May 2006 - 11:28)

neko a écrit :
Dans ce cas là :

background-color: inherit;
color: inherit;

autant supprimer ces deux lignes qui ne servent à rien si un élément hérite correctement des propriétés
de son parent ?!
Plus de "color" -> plus de "background-color" -> plus d'avertissement.

En théorie, oui, tout élément hérite de son parent pour les couleurs. Mais pour certains navigateurs, ce n'est pas le cas. Ces deux lignes sont utiles

Sinon, la solution ultime pour éviter ça : ne plus du tout utiliser de couleurs de fond/écriture

M'enfin, quitte à faire ça, autant naviguer sous Lynx ou Netscape 4 Retournons au Web préhistorique !
Modifié par Ladytron (05 May 2006 - 11:32)

neko a écrit :
Dans ce cas là :

background-color: inherit;
color: inherit;

autant supprimer ces deux lignes qui ne servent à rien si un élément hérite correctement des propriétés
de son parent ?!
Plus de "color" -> plus de "background-color" -> plus d'avertissement.

pas vraiment...

si on retire backgound-color et color on a l'avertissement...
je n'avais ni color ni background dans les elements dont je parlais (ceux sans texte)
et si on a juste un des d'eux on a l'avertissement


a+
Modifié par Angelik (05 May 2006 - 11:41)

Voila ma feuille de style est correcte enfin presque

a écrit :
Avertissements
* Ligne : 94 (Level : 1) background-color et border-right-color sont de la même couleur : #site
* Ligne : 94 (Level : 1) background-color et border-top-color sont de la même couleur : #site
* Ligne : 94 (Level : 1) background-color et border-left-color sont de la même couleur : #site

juste ces 3 remarques...
mais cela sera sans doute l'occasion d'un prochain topic sur le forum...
car il s'agit d'un border a 1px , si je le retire cela deforme tout...

merci pour vos conseils sur les background en particulier

bon week end
a+

a écrit :
si on retire backgound-color et color on a l'avertissement...
je n'avais ni color ni background dans les elements dont je parlais (ceux sans texte)
et si on a juste un des d'eux on a l'avertissement

Je ne crois pas. On ne peut pas avoir un avertissement sur quelque chose n'existant pas. Si tu as ceci :

a écrit :
# Ligne : 29 (Level : 1) Vous n'avez pas de couleur de fond définie avec votre couleur : p

C'est que ta partie CSS donne quelque chose comme:

p {
   color: #000;
   }

Si tu supprimes "color" ici, l'avertissement n'a plus lieu d'être.

a écrit :
car il s'agit d'un border a 1px , si je le retire cela deforme tout...

Peut-être des marges qui fusionnent.
Modifié par (05 May 2006 - 12:23)

neko a écrit :
Je ne crois pas. On ne peut pas avoir un avertissement sur quelque chose n'existant pas.

(...)

exact autant pour moi.
c'est parce qu'au debut j'ai rajoute background a tout, et qu'ensuite border...

merci

a+