28220 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

J'essaie de faire valider ma page css par le W3C mais je ni arrive pas il me parle d'avoir un arbre grammatical correcte.

Enfin voila l'erreur complète :

"Pour fonctionner comme prévu, votre feuille de style CSS doit avoir un arbre grammatical correct, cela implique que vous devriez utiliser de l'HTML valide."

Sachant que ma page html est validé par le W3C.

et voici mon code css :

body {
margin: 0;
font-family: verdana, arial, sans-serif;
font-size: 12px;
background-color: #000000;
}

.head1 {
background: url(images/fondEnTete1.jpg);
width: 770px;
height: 91px;
border: 2px outset #FF5E21;
border-bottom-style: hidden;
}

.head2 {
border: 2px outset #FF5E21;
background: url(images/zebre.jpg);
width: 770px;
height: 36px;
}

.gauche {
border: 2px outset #FF5E21;
border-top-style: hidden;
position: absolute;
left:0;
background-color: #D68D6A;
width: 181px;
height: 337px;
}

.centre {
border: 2px outset #FF5E21;
border-top-style: hidden;
background-color: #D68D6A;
margin-left: 181px;
width: 589px;
height: 337px;
}
.contenu {
border: 2px outset #FF5E21;
border-top-style: hidden;
background-color: #FFFFFF;
width: 550px;
height: 298px;
}

ul,li {
list-style-type: none;
margin: 0;
padding:0;
line-height: 30px;
}

.menu {
margin-top: 80px;
margin-left: 10px;
width: 160px;
height: 170px;
border: 1px outset #FFFFFF;
background-color: #FF5E21;
font-family: verdana, arial;
font-size: 110%;
text-align: center;
}

.menuItem{
margin-top: 10px;
margin-bottom: 10px;
margin-left: 10px;
text-align: left;
color: #FFFFFF;
}

.arobaseItem{
float: left;
margin-left: 10px;
margin-top: 10px;
margin-bottom: 10px;
}

Voila et merci d'avance a ceux qui repondront à ce message Smiley biggrin Smiley biggrin Smiley biggrin
Modifié par erehcab (28 Sep 2005 - 09:25)
Modérateur
Bonjour,

Juste comme ca, as-tu fais validé ton code HTML ? Le message d'erreur semble t'indiquer que ton code HTML n'est pas valide.

Edit : Je viens de remarquer que tu dis que ton code HTML est validé W3C. Peux-tu nous donner l'url de ta page html ? Le validateur HTML ne détecte peut-être pas une erreur particulière, tandis que le validateur CSS si.

Par exemple, dernièrement, j'avais oublié de mettre un espace entre deux attributs d'une balise :


<mabalise attribut1="valeur1"attribut2="valeur2" />


C'était une erreur de frappe. Le validateur HTML me disait que tout était valide, tandis que le validateur CSS me donnait une erreur semblable à la tienne.
Modifié par Merkel (27 Sep 2005 - 16:04)
Administrateur
Salut et bienvenue à toi,

Je vais devoir jouer mon rôle de modérateur car il semblerait que tu n'aies pas pris le temps de lire le message d'annonce en haut du forum ("nouveau sur le forum").

Celui-ci indique clairement où se trouvent les Règles du forum (celles que tu as confirmé avoir lues et approuvées en cliquant sur le bouton d'inscription).

Ces règles expliquent notammment comment afficher un code correctement sur le forum. Merci de les appliquer pour le bien de la communauté. Smiley cligne

PS : attention à modifier ton message plutôt que d'en créer un nouveau
Modifié par Raphael (27 Sep 2005 - 16:06)
Merkel a écrit :

Par exemple, dernièrement, j'avais oublié de mettre un espace entre deux attributs d'une balise :


<mabalise attribut1="valeur1"attribut2="valeur2" />


C'était une erreur de frappe. Le validateur HTML me disait que tout était valide, tandis que le validateur CSS me donnait une erreur semblable à la tienne.

hum Smiley hum

Ça m'étonnerait que le validateur CSS donne ce genre d'information. Comment saurait-il à quelle page est liée ta feuille de style ?

Regarde bien. La phrase suivante est présente systématiquement quand on valide.

« Pour fonctionner comme prévu, votre feuille de style CSS doit avoir un arbre grammatical correct, cela implique que vous devriez utiliser de l'HTML valide. »

Ça dit simplement que le HTML doit être valide, et non qu'il est invalide.

Pour preuve, une feuille liée à rien du tout :
upload/196-validator.png
Modifié par Stephan (27 Sep 2005 - 16:19)
En lisant très attentivement la réponse de Stephan, et compte tenu du dépit de erehcab, on peut deviner que ce dernier a utilisé l'interface W3C permettant la validation d'un fichier local en fournissant un fichier XHTML, au lieu d'un fichier CSS...
Modifié par Xavier (27 Sep 2005 - 16:25)
Modérateur
Stephan a écrit :

Ça m'étonnerait que le validateur CSS donne ce genre d'information. Comment saurait-il à quelle page est liée ta feuille de style ?


En utilisant le bar du webdeveloper dans Firefox. Voici le cas concret :


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr" xml:lang="fr">
<head>
<title>Mon Site</title>

<meta http-equiv="Content-Type" content="text/HTML; charset=iso-8859-1" />
<meta http-equiv="Content-language" content="fr-FR" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta http-equiv="Content-Style-Type" content="text/css" />

<style type="text/css">
<!--
@import url("css/styles.css");
-->
</style>
</head>
<body id="haut">
	<div>
		<p><a href="http://www.google.com"title="Aller sur google">Google Rules</a></p>
	</div>
</body>
</html>


Quand je clique sur Tools > Validate CSS, j'obtiens l'erreur suivante :


http://jigsaw.w3.org/css-validator/validator a écrit :

Please, validate your XML document first!

Line 19

Column 37

Element type "a" must be followed by either attribute specifications, ">" or "/>".


Ensuite, si je fais Tools > Validate HTML, j'obtiens :

http://validator.w3.org/check a écrit :

This Page Is Valid XHTML 1.0 Strict!


En validant les CSS de la page courante via la bar de développeur FireFox, le validateur sait de quelle page HTML il s'agit. Il peut donc valider d'abord le code HTML avant de valider le code CSS.

Pour ce qui est de l'erreur de erehcab, oui il s'agit peut-être que d'un conseil, rien de plus.
Modifié par Merkel (27 Sep 2005 - 16:41)
Merkel a écrit :

En validant les CSS de la page courante via la bar de développeur FireFox, le validateur sait de quelle page HTML il s'agit. Il peut donc valider d'abord le code HTML avant de valider le code CSS.

Ah je comprends ! En passant la page HTML au validateur CSS.

Je n'ai jamais eu ce type de message. Ça doit être parce que je fourni toujours du HTML valide. Smiley smile
Modifié par Stephan (27 Sep 2005 - 16:47)
Modérateur
Mais comme t'as pu remarquer, ca reste tout de même étrange que le validateur CSS m'indique que j'ai une erreur XHTML alors que le validateur HTML lui-même ne détecte rien du tout. Smiley kc
Merci d'avoir répondu à mon post et excusez du retard de ma reponse.

Je n'est tjr pas réussi à faire valider ma feuille de style, je me demande si ce n'est pas plutot moi qui n'est pas compris le fonctionnement du validateur W3C css.

Si quelqun avait une feuille de style valide à me passer je pourrai faire la comparaison du résultat avec la mienne, ou si quelqun veut bien essayer avec la mienne (elle se trouve en haut du post).

Merci d'avance. Smiley biggrin Smiley biggrin Smiley biggrin
Le validateur CSS W3C ne rapporte pas d'erreur sur le code CSS que tu as proposé au dessus, il ne transmet que des avertissements.

Si tu obtiens des erreurs c'est que probablement tu n'utilises pas correctement le validateur.
Merci de ta réponse,

Mon code css est donc valide selon le W3C,
ce qui veut dire que je peut afficher sur mon site le logo W3C correspondant mais contrairement à la validation de page XHTML il ne donne pas directement le code à rentrer sur ca page je ne voit qu'un logo css en bas de page.

Ou est ce que je pourrait trouver le code correspondant à ce logo ?

Merci Smiley biggrin
Modifié par erehcab (29 Sep 2005 - 12:09)
Pour que le validateur te propose le logo il faut lui soumettre l'url d'une page en ligne (et que cette page ne fasse pas apparaitre d'erreur bien sur).

Le logo n'a pas de sens si tu lui soumets simplement un fichier CSS local Smiley cligne