validation css

[jeanpierre949]

Bonjour.

je ne comprends pas comment marche le validateur css W3C.

Ma page est valide en Xhtml page html

Mes feuilles de styles sont validées par css validator /spfcss.css et /barnav.css

, mais quand j'envoie la page html pour valider le css;reponse faire valider d'abord en xml.Si l'une ou l'un d'entre vous les pro peut me fournir une explication je l'en remercie d'avance

Modifié 2 Septembre 2005 par jeanpierre949

[jeanpierre949]

Desolé et confus de vous avoir derangé mais la apparement ca marche maintenant et Merci encore

[Xavier]

Ça ne marche toujours pas, mais ta page HTML n'est pas valide... http://validator.w3.org/check?verbose=1&ur...montpellier.fr/

Tu as un tag <img> qui n'est pas fermé, il me semble que le message du validateur est clair

Et le validateur CSS ne peut pas analyser les css d'une page invalide.

[jeanpierre949]

ca recommence? il y a 5mn ca marchait

[Xavier]

Le pire... c'est que c'est l'image "Valid CSS" qui provoque l'erreur

Elle n'est pas fermée. Tu fais du XHTML (euh... non, en fait je devrais plutôt dire que tu as mis un doctype XHTML ), alors tu dois fermer toutes les balises. (Ou alors, mieux, assumer que tu fais du HTML et vraiment faire du HTML... )

PS : c'est normal que ton site est tout cassé tant dans Firefox qu'Opera, et aussi dans IE6 mais en inverse ?

Modifié 2 Septembre 2005 par Xavier

[jeanpierre949]

c'etait vrai que l'image valid css n'etait pas fermée en xhtml mais la faut voir du coté du consortium W3C moi j'ai fait fait un copie collé alors c'est le consortium qui ne code pas en xhtml moi je leur faisais confiance

[Xavier]

Ben non, ils codent en HTML... quoi de plus normal ?

[Dudu]

C'est moi qui ai trop bu (c'est possible) ou je vois bien un code XHTML sur les pages validées ?

Here is the HTML you could use to add this icon  to your Web page:

  <p>

    <a href=&quot;http://validator.w3.org/check?uri=referer"><img

        src=&quot;http://www.w3.org/Icons/valid-xhtml10"

        alt="Valid XHTML 1.0 Transitional" height="31" width="88" /></a>

  </p>

Voici le fragment de XHTML que vous pouvez utiliser pour ajouter cette icône à votre page Web:

<p>

<a href=&quot;http://jigsaw.w3.org/css-validator/">

  <img style="border:0;width:88px;height:31px"

      src=&quot;http://jigsaw.w3.org/css-validator/images/vcss"

      alt="Valid CSS!" />

</a>

</p>

*

**

Le pire... c'est que c'est l'image "Valid CSS" qui provoque l'erreur  

Dans le même ordre d'idée, c'est ton lien vers le validateur qui provoque les majorités d'erreur de cette page-ci

(oui, il y a aussi une balise non-fermée pour une image de pub, le problème a déjà été remonté)

[jeanpierre949]

salut,

Dudu, je nai pas compris ton "je reve?"

Qu'elles images ont une balise pas fermée?

Il me semble que le validateur W3C ne laisse pas passer ce genre de detail,je parle sur les pages validées biensur celles que je n'ai pas soumises "liens" ou "partenariat"ont peut etre un probleme je ne vais pas passer des heures a corriger le code copies colles pour le moment donc ces pages peut etre ont un probleme

Modifié 3 Septembre 2005 par jeanpierre949

[Xavier]

C'est bizarre que le validateur indique que ce code est valide...

<img src="http://www.secourspopulaire.asso.fr
/goto/bannieres/dossPeda_banniere_statique.gif"width="435" 
height="60"border="0" alt="Les dossiers pedagogiques du Secours populaire" />

Une URL qui retourne à la ligne (d'ailleurs c'est étonnant que les navigateurs affichent l'image... un retour à la ligne équivalent à un espace, l'image http://www.secourspopulaire.asso.fr%20/got...re_statique.gif n'existe évidemment pas !) et des attributs collés les uns aux autres (ils doivent être séparés par un espace)... je ne comprends pas pourquoi ça passe !

[jeanpierre949]

Il n 'y a pas de retour a la ligne c'est la meme ligne elle est sur 2 niveaux mais c'est la meme ligne n°4. pour les attributs il me semble avoir vu qu-il ne fallait pas les espacer mais je peux me tromper

[Xavier]

Je te certifie qu'elle est sur plusieurs lignes

(En fait maintenant c'est le lien parent qui est coupé... mais il est bel et bien coupé dans ce qui est reçu). Je parle de celle présente aux lignes 94, 95 et 96 (si cela est généré dynamiquement, tu peux vérifier avec le validateur. Il y a d'autres liens coupés. Je ne trouve plus la référence de l'interdit, mais en tous cas Tidy hurle dans de pareils cas

Pour les attibuts, je crois que tu te trompes

Selon la spec HTML 4.01 :

http://www.la-grange.net/w3c/html4.01/intro/sgmltut.html]Les couples attribut/valeur apparaissent avant le caractère « > » final de la balise ouvrante d'un élément. Un nombre quelconque de couples attribut/valeur (autorisés), séparés par des espaces, peut apparaître dans la balise ouvrante d'un élément.

Maintenant je comprends encore moins pourquoi le validateur laisse passer tout ça...

PS : il n'y a que chez moi que le bloc central passe par-dessus le menu de gauche ?

[jeanpierre949]

es-tu sur que le " html 4.01" et le "xhtml1.0 transitionnal" doive se coder de la meme maniere?

pour le lien je te dit qu'il ecrit sur une seule ligne et ce que tu vois ce n'est que la transcription html du php. pour affichage de la page

en quelle resolution as-tu ce probleme de pages qui se chevauchent?

je voudrais bien resoudre ce probleme merci. parce que moi sur ff ou ie ca passe

Modifié 5 Septembre 2005 par Monique

[Xavier]

es-tu sur que le " html 4.01" et le "xhtml1.0 transitionnal" doive se coder de la meme maniere?

Pour les espaces entre attributs ? Sur et certain ! (en vrai XHTML / XML je crois bien que ta page est considérée comme mal formée si tu colle 2 attributs... et rien n'est affiché.)

pour le lien je te dit qu'il ecrit sur une seule ligne et ce que tu vois ce n'est que la transcription html du php.

C'est bien le problème. Ce qui compte c'est justement le HTML final reçu par le client web. Le php on s'en fiche totalement, ton lien peut être sur 25 lignes ça n'a aucune importance, pourvu qu'il ne soit que sur une seule dans le HTML envoyé

pour affichage de la page en quelle resolution as-tu ce probleme de pages qui  se chevauchent? je voudrais bien resoudre ce probleme merci. parce que moi sur ff ou ie ca passe

<{POST_SNAPBACK}>

Ah ok je comprends Il faut être en 1024 pour que ça s'affiche comme il faut... plus ou moins ça passe pas

Comment as-tu disposé ces blocs ? N'as-tu pas fait un mélange d'unités (pourcents et px en particulier) ? Ou alors tu as fixé la marge de #bas_centre ?

Il y a des tas de moyens de résoudre ça...

Edit : ah non, tu l'as positionné en absolu... à plus haute résolution le centre passe à gauche de #basgauche

Une solution : faire flotter gauche et droite, fixer leur largeur (p.ex en em pour faciliter l'agrandissement, encore que ça puisse poser d'autres problèmes en cas de fort agrandissement... alors il faut mettre un max-width en % que IE ne comprendra pas) et laisser le bas_centre occuper la place du milieu.

Autre solution (peut-être mieux, voir la fin) : gauche et droite en position:absolute avec largeur fixe (comme en haut, em et max-width) et fixer les marges de bas_centre avec exactement les mêmes valeurs et unités que celles utilisées pour les menus (ne pas oublier le min-width s'il y a un max-width sur les bords). Très important d'avoir les mêmes valeurs et unités, sinon tout est foutu !

Avantage de cette solution : possibilité de mettre les menus à la suite dans le contenu, ce qui est un plus pour l'accessibilité, le lecteur vocal/navigateur texte n'ayant pas à lire/afficher tout le menu à chaque page avant de pouvoir afficher enfin le contenu).

Modifié 3 Septembre 2005 par Xavier

[jeanpierre949]

ok merci je vais l'attaquer ce matin

[jeanpierre949]

voila Xavier maintenant il doit etre visible meme en 800x600 avec 1petit scroll de 10 px

[Xavier]

Je peux continuer ?

Je dois avouer avoir réglé mon Firefox pour ne pas afficher de polices en moins de 13px. (indispensable, la résolution optimale de mon écran rendant les choses plus petites difficilement lisibles).

Et bien... c'est pas terrible, le pied de page est envahi par le menu qui déborde !

Je te laisse agrandir pour voir le résultat (C'est peut-être parce que tu as passé les menus en positions absolute... désolé )

[jeanpierre949]

Salut.

Il est tout a fait normal si tu surdimensionne les polices et rirn que les polices le reste de la page soit affiché en dessus au en dessous ou a coté puisque les images tu ne les redimentionne pas ,d'allieurs comment fais-tu pour lire les images-texte ? Peut-etre que ton ecran aurait besoin d'un reglage? a++

[Xavier]

Non ce n'est pas tout à fait normal. Disons que ça arrive assez souvent, mais que c'est plutôt une "erreur" de conception et qu'il est tout à fait possible de contourner le problème. Comment ? En faisant une mise en page un peu plus souple, où toutes les tailles ne sont pas fixées en px mais plutôt en em si possible, et où les blocs s'adaptent à la taille du texte

(D'ailleurs je vois que c'est ce que tu as commencé à faire, le bas passe assez bien maintenant ! )

Pour les images-texte, elles sont censées avoir un texte alternatif non ?

Encore un détail, dans barnav.css, sous h4 tu as mis ça :

	color:#000000;
	background-color: #000000;

Évite de les définir de la même couleur. Choisi plutôt un beige assez semblable à l'image de fond. Idem pour les listes de menu horizontales (haut et bas), beige-clair sur fond blanc il y a mieux...

[jeanpierre949]

je peux t'envoyer 2 screenshots 1 en 800 et 1 en 1024 effectués aux USA pour que tu puisses constater l'affichage des pages sous FF et comparer avec ce que tu as toi.Le seul probleme probleme que j'ai en 800 c'est ce que j'ai dit au debut 1 scroll horizontal de 15 a20px

[Xavier]

1 scroll horizontal de 15 a20px

<{POST_SNAPBACK}>

... correspondant vraissemblablement à la largeur de la barre de défilement + la bordure de la fenêtre

[jeanpierre949]

oui! c'est exactement ca.

La je reconnais avoir mal dimentionné des le depart.