mise en forme liste

[pierrick]

Merci mais comme j'utilise IE7 je vais m'arrangé pour modifier mon menu.
Par contre si je decoche "dtd stricte" je ne comprends pas la notion de DTD Transationnel, bref ca veux dire quoi lol?

Message envoyé avec : Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; .NET CLR 1.1.4322)

[pierrick]

En attendant ta reponse, j'ai suivi ton conseil et je suis reparti sur une page blanche. Voici le résultat, qu'en penses tu ? c'est du moins ce que je souhaite sous IE7 http://pingpongfalaise.free.fr/index.html

Merci pour tes conseils

Pierrick

Message envoyé avec : Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; .NET CLR 1.1.4322)

[Mongo Bob]

j'utilise IE7

ben oui, mais tes visiteurs?

Transationnel, bref ca veux dire quoi lol?

Transitionnel : permet, tout en étant mieux reconnu par les navigateurs (tous, pas que IE) de coder avec moins de règles à respecter que quand tu es en strict comme toi jusqu'ici.
C'est pas toi, qui codes, c'est Kpz, mais l'utilisation de l'interface de Kpz, particulièrement celle de la barre de mise en forme 2 crée du code valide peut-être mais dépassé, type la mise en forme se fait dans la page html, pas dans une feuille css.
le transitionnel est plus adapté pour un débutant.
ci-dessous, voir le paragraphe sur html transitionnel :
http://css.alsacreations.com/Bases-et-i ... nt-choisir

Voici le résultat, qu'en penses tu ?

alors là, trés curieux. J'ai pas de mise en forme sous FF (*), OK avec IE6.

Bloqué, là.
Y'a quand même ça :

Code : Tout sélectionner

<link rel="stylesheet" href="style_menu" type="text/css">

dans lequel il "manque" le title et les media, mais je les ai enlevé sur une page à moi que j'ai mise en ligne, ben c'est pas pour ça. Je pensais à l'absence de title, mais non.


(*)J'ai une mise en forme si je coche "éditer css" avec Webdeveloper! Si je décoche, même en recoupant la fenêtre aux dimensions "scope" comme avec l'option cochée, toujours pas de mise en forme. Surréaliste, si qqn sait... Ymai?

[chinon37]

Sachant que windows aime bien les extensions, le problème de non affichage des styles pourrait bien provenir de l'absence de .css à la fin du nom de fichier de la feuille de style.
Il me parait souhaitable de renommer la feuille de style externe de style_menu en style_menu.css

IE7 me prend la tête: mon site (de ping!) s'affiche impec sur FF et IE6, et bogue sur IE7 -> décalages en tous genres... et comme je ne veux pas installer IE7, je ne me suis pas encore penché sur le problème...
Vive Firefox!!!

[Mongo Bob]

Sachant que windows aime bien les extensions, le problème de non affichage des styles pourrait bien provenir de l'absence de .css à la fin du nom de fichier de la feuille de style.
Il me parait souhaitable de renommer la feuille de style externe de style_menu en style_menu.css

Tu as raison, et je regrette de pas l'avoir vu, c'est comme le nez au milieu du ...
Cocher "editer css" dans Webdev, c'est comme solliciter un autre navigateur qui ignore l'absence de ".css".
En récompense, Chinon, je regarderai ton site sur un pc avec IE7...

[Fabrice.Tres.Net]

IE7 me prend la tête: mon site (de ping!) s'affiche impec sur FF et IE6, et bogue sur IE7 -> décalages en tous genres... et comme je ne veux pas installer IE7, je ne me suis pas encore penché sur le problème...
Vive Firefox!!!

ça sent les décalages... un petit coup de

Code : Tout sélectionner

* {
  margin: 0;
  padding: 0;
}

devrait certainement améliorer un peu les choses à peu de frais.

[chinon37]

Merci, Fabrice, du petit conseil. Dès que j'ai un moment, je regarde.

J'ai comme l'impression que j'ai fait une erreur ici:

Code : Tout sélectionner

<!--[if IE]>

devrait être:

Code : Tout sélectionner

<!--[if IE6]>

Je testerais dès que j'aurais un moment et une possibilité d'accéder à ie7.

[Mongo Bob]

il y a déjà un petit décalage de la photo sous IE6.
Je mettrais des largeurs en % à #corps et à #menu aussi peut-être.

ça sent les décalages... un petit coup de
Code:
* {
margin: 0;
padding: 0;
}

devrait certainement améliorer un peu les choses à peu de frais.

euh... ceci fout le binz sous FF aussi, et dans le sens vertical! Tu as essayé en le collant dans la css (cocher "éditer les css" avec Webdev)?

[pierrick]

Merci pour l'info, je vais commencer par modifier le nom de page css et continuer à avancer dans la construction et le tester sousIE7 et firefox

Message envoyé avec : Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; .NET CLR 2.0.50727)

[Fabrice.Tres.Net]

ça sent les décalages... un petit coup de
Code:
* {
margin: 0;
padding: 0;
}

devrait certainement améliorer un peu les choses à peu de frais.

euh... ceci fout le binz sous FF aussi, et dans le sens vertical! Tu as essayé en le collant dans la css (cocher "éditer les css" avec Webdev)?

ben, non.. je n'avais pas fait l'essai sous FF, j'avais juste regardé sous IE7 l'allure du problème.
Cela semble perturber la présentation, cela sous-entend que la présentation tient compte des valeurs initiales des navigateurs, donc des sources de problèmes.

[Mongo Bob]

Merci pour l'info, je vais commencer par modifier le nom de page css et continuer à avancer dans la construction et le tester sousIE7 et firefox

il faudra que tu supprimes le lien vers la feuille de style par la croix rouge dans Cascades, et que tu ailles la rechercher par la palette, "feuille liée", "liste des média" : all, à titre retaper le nom de ta feuille avec le fameux ".css", enfin décocher "cocher pour désactiver la feuille..." en haut, OK.

[pierrick]

Merci, voila c'est fait je penses que ma page est plus propre sous firefox. Peux tu aller voir ce lien et me dire ce que tu penses du code ? J'ai réussi a obtenir ce que je souhaitais http://pingpongfalaise.free.fr/championnats.html

Alors l'avis d'un expert mais au combien sympa et disponible. Encore merci

Message envoyé avec : Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; .NET CLR 1.1.4322)

[Mongo Bob]

alors là, je dis bravo, y'a du progrès!
Tu as considérablement réduit le nombre d'erreurs!!!
Le site s'affiche correctement sur IE et FF (petit problème d'affichage encore en 800*600).
Faudrait juste que tu reprennes le code pour améliorer l'accessibilité, c'est à dire améliorer la sémantique :
par exemple, tu as créé une liste (ul et li) pour ton menu haut, tu devrais créer deux autres listes pour les deux autres menus au lieu de les mettre tel quelles l"un dans la div #menu2, l'autre dans un tableau.
A mon avis, "ESF TENNIS DE TABLE" devrait être sous h1 au lieu de "div id entete". <h1> représente un titre de 1ère importance.
En css, h1 doit remplacer #entete en prenant toutes les propriétés de celui-ci, comme des ul par exemple, remplacent la div et le tableau.
Ca vaudrait le coup de reprendre tout ça à 0, sans vouloir te décourager, ça peut aller trés vite...

Je t'avais mal donné le lien vers le cours de Ymai, l'autre fois, voici le bon :
http://info.sio2.be/kpz/index.php

[pierrick]

Merci du compliment lol. Bon serieusement j'ai repris mon code en mettant une liste dans mon menu2 (celui de gauche) voila le résultat : http://pingpongfalaise.free.fr/championnats2.html par contre j'aimerai que le link ou hover fonctionnent sur la ligne complete de mon menu, c'est a dire à droite et à gauche du texte et ceci jusqu'au borne du div. Pour ton info j'ai pensé à un "menu" en tableau car je compte mettre dedans juste des liens sur des résultats des anciennes saisons ou phase. Le tableau me parait plus pratique pour rajouté par exemple une colonne pour la 2ieme phase de la saison 2007-2008 et ainsi de suite en rajoutant des colonnes.
En attendant je modifie mon code avec le H1, a propos on bon intégrer des images dans H1 ?
Encore merci pour ton aide.

Message envoyé avec : Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; .NET CLR 1.1.4322)

[Mongo Bob]

Pour ton info j'ai pensé à un "menu" en tableau car je compte mettre dedans juste des liens sur des résultats des anciennes saisons ou phase. Le tableau me parait plus pratique pour rajouté par exemple une colonne pour la 2ieme phase de la saison 2007-2008 et ainsi de suite en rajoutant des colonnes.

oui, je suis tellement anti-tableau que j'ai parlé trop vite! Tu as raison, un tableau, c'est parfait pour présenter des données-textes. Mettre une image peut poser problème par contre...

j'aimerai que le link ou hover fonctionnent sur la ligne complete de mon menu, c'est a dire à droite et à gauche du texte et ceci jusqu'au borne du div

faudrait incluer le <li> dans le lien, mais c'est interdit, Kpz ne fera pas ça, un <a> ne peut contenir un <li>, il y a sûrement une solution de style pour élargir l'effet hover du <a>.
A part ça, les effets de survol sont excellents, ça fait toujours son petit effet.

a propos on bon intégrer des images dans H1 ?

oui on peut (j'ai bien compris?), et faut pas s'en priver, plutôt en css en fond du <h1>, d'ailleurs.


Tu n'as plus qu'une seule erreur : "<table> lacks "summary" attribute", un résumé qui explique à quoi sert ton tableau :
http://www.la-grange.net/w3c/html4.01/s ... ef-summary
solution d'accessibilité à l'usage des non-voyants.
ce qui ne gêne pas la validation W3C :
http://validator.w3.org/check?verbose=1 ... nats2.html