Pages :
(reprise du message précédent)

Herspear a écrit :
Tu vas dire que je suis nul

Oui tu es nul !
Non, mais tu crois quoi ???
Mon site, j'y ai passé du temps

Non, je déconne ! Smiley biggrin
Tu vas y arriver (j'y suis arrivé alors ... )
Regardes mon code source pour mon menu. Smiley cligne
C'est pas un exemple 100% parfait loin de là mais il est OK XHTML et CSS.


<div id="gauche">

          <!-- affichage du menu -->

			<ul class="menugauche">
<li><a href="introduction.php" title="Page d'introduction">Introduction</a></li>
<li><a href="avant.php" title="Page d'avant propos">Avant Propos</a></li>
<li><a href="definitions.php" title="Page de définitions">Définitions</a></li>
<li><a href="calcul.php" title="Page de calcul poids idéal">Poids Idéal ?</a></li>
<li><a href="dieteticien.php" title="Page sur le métier de dieteticien">Le Diététicien</a></li>
<li><a href="recettes.php" title="Page de menus et de recettes">Menus-Recettes</a></li>
<li><a href="liens.php" title="Page de liens utiles">Liens Utiles</a></li>
<li><a href="regime.php" title="Obtenir un régime">Votre Régime</a></li>
<li><a href="consultations.php" title="Déroulement des consultations">Consultations</a></li>
<li><a href="recherche.php" title="Page de recherches" accesskey="4">Recherches</a></li>
<li><a href="contact.php" title="zone de contact" accesskey="9">Contact</a></li>
<li><a href="accessibilite.php" title="Page sur l'accessibilité" accesskey="0">Accessibilité</a></li>

			</ul>
</div>


@+

Edit :
j'oubliais le truc pour que ton menu ne parte pas en vrille.
Mon menu est contenu dans un bloc nommé "gauche" qui a ces propriétés :
#gauche {
	BORDER: 0;
	LEFT: 0px;
	MARGIN-LEFT: 0;
	MARGIN-TOP: 14px;
	HEIGHT: 20em;
	WIDTH: 9em;
	POSITION: absolute;
	TEXT-ALIGN: center
}


Edit2 :
Je viens de faire des tests en copiant ta page.
Il est tard et je suis moi aussi assez "nul" mais c'est vrai que quand ton menu est entre <ul> et </ul>, il disparait.
En fait, je pense qu'il se décale à droite et n'est plus visible.
Je pense donc que ça vient vraiment des caractéristiques de son bloc conteneur.
Je file au lit là ... Je commence à devenir tout froid ...
Modifié par dieteticien (13 Nov 2005 - 01:26)
Moi aussi le menu file à droite. Je vois le bloc qui se barre sur le milieu de la page. Mais pourquoi fait il ca?

Ah bon il fait froid dans ta région?

Ben sinon à demain alors et bonne nuit.

Merci pour ton aide. herspear
Salut Diététicien,

Ben il est vrai qu'à comparer de moi la page que tu m'as recommandé je n'ai pas cela : <UL class=menugauche>.

Donc je pense que c'est là que se trouve le problème.

Tiens en parlant de diététique puisque je suis allé faire un tour sur ton site, je dois rouler des bouilletes pour la pêche. Un vrai casse tête pour équilibrer le repas de nos chers poissons. En gros les attirer sur le poste sans les gaver.

Bien à toi. Herspear
Salut Dététicien,

Bon ben on dirait que c'est bon maintenant.

Il passe au validateur. Dit moi ce que tu en pense dès que tu auras jetter un oeil . Bien à toi et merci. Herspear
Modifié par Herspear (13 Nov 2005 - 14:04)
Hello,

En fait, il y a 2 choses :
Les caractéristiques que tu appliques à ton bloc "gauche" et les caractéristiques que tu appliques à ton menu.
Ton menu est dans un bloc ; faut pas l'oublier.

Dans l'exemple de Raphaël, comme dans mon site (ma source est évidemment Raphaël), tu as :
- des informations pour disposer le bloc de gauche
- des informations de style à appliquer au menu (de gauche)

J'espère t'éclairer un peu.
Ben c'est ce que j'ai compris avec le temps. Saut qu'en fait il me manquait simplment de mettre les caractéristiques du menu.

Ce qui faisait que mon bloc était à gauche et le menu se barait à droite. En mettant les caractéristiques à ce derniers il réintègre le bloc.

Par contre, j'ai essayé en faisant ctrl + et comme tu disais, le menu part en vrille Smiley biggrin .

Je l'ai fait passer aussi au validateur CSS. Il passe mais seulement si je vire les couleurs de ma scroll. Donc je vais qd mm retourner à mes anciennes caratéristiques c'est qd mm plus estétique.

Qu'en penses tu? Herspear
écoutes, sans vouloir être méchant, on dirait que tu as fait ton code à la fourche. En plus tu ne lis pas les conseils que l'on te donne. Les balises ne sont pas fermées et n'ont pas été mis en minuscules, il y a des fautes de syntaxes à peu près partout, sans parler du code qui ne sert à rien ... un vrai carnage.

Je fais un dernier effort pour t'aider et après j'arrête. J'ai récupéré ton HTML et ton CSS chez moi et j'en ai modifié des parties comme suit :

HTML :
<div class=menu>
	<ul>
	<li><a href="http://domainedevillaine.free.fr/"id="accueilnav">Accueil</a></li>
    <li><a href="http://domainedevillaine.free.fr/Leschalets.htm"id="Leschaletsnav">Les Chalets</a></li>
    <li><a href="http://domainedevillaine.free.fr/Legite.htm"id="Legitenav">Le Gîte</a></li>
	<li><a href="http://domainedevillaine.free.fr/Activites.htm"id="Activitesnav">Les Activités</a></li>
	<li><a href="http://domainedevillaine.free.fr/Situation.htm"id="Situationnav">Situation</a></li>
	<li><a href="http://domainedevillaine.free.fr/Contact.htm"id="Contactnav">Contact</a></li>
	<li><a href="http://domainedevillaine.free.fr/Liens.htm"id="Liensnav">Liens</a></li>
	</ul>
	<div align="center"><img class="photo" height="76"  width="73" alt="Chalet" src="Logogite.jpg" /></div>
</div>


CSS:
.menu {
	float:left;
	width: 150px;
	text-align: center;
	background-color: #ccccff;
}
.frame {
	margin-left: 150px;
	height: 500px;
	overflow: auto;
	background-color: #9999cc
}

ul {
	list-style-type: none;
	text-align: center;
}

li a {
	color: #9999CC;
	font-size: 24px;
	font-family: "Monotype Corsiva", sans-serif;
	text-decoration: none;
	font-weight: 700;
}


Avec cela, cela marche nickel chez moi sur tous les navigateurs. Tu remarqueras que j'ai viré plein de trucs qui ne servait à rien.

Essaie et donnes-moi le résultat
Tu n'as pas repris les modif de CSS que je t'ai proposé. Comme tu fixes tout de façon rigide (position, hauteur de ligne, taille des div, etc...) il est normal que les navigateurs ne puissent pas gérer toute les contraintes que tu leur imposes.

Je suis désolé de me répéter, mais il ne peux y avoir de solution de rapiéçage. Si tu veux faire quelques chose de propre, il te faut "travailler dans le flux" comme disent les spécialistes. C'est à dire, retirer toutes les contraintes de positionnement, taille et autres gadgets inutiles et ensuite ne fixer que le stricte nécessaire à ta présentation.

Pour ma part, sans être un intégriste des standards, je passe beaucoup de temps à supprimer tout code inutile (HTML, comme CSS) afin de laisser le + de degrés de liberté aux navigateurs. J'ai lu et relu les bibles (le livre de Raphael et celui de Zeldman) et je passe beaucoup de temps sur les sites de référence (openweb, W3C, yoyodesign, etc...). C'est à ce prix que tu auras du code propre, facile à maintenir et surtout que tu comprendras.

Désolé de ne pouvoir t'en dire plus et bon courage
Bonsoir Merlin,

Bon et bien j'ai modifié les paramètres de menu et la feuille de style comme tu me l'as conseillé.

En résolution 1024-768, pour moi le résultat n'est pas concluant.
Sous IE, le menu se trouve concentré en haut à droite de son bloc alors qu'avant il était centré avec une taille de police plus grande et mieux réparti.

Sous Mozilla, le bloc du menu est beaucoup plus large et la police de ce dernier plus petite. Un scroll vertical apparait en plus du scroll que j'ai créé mais disparait lorsque je passe en résolution supérieure.

Ce que je voulais en fait à la base, c'était avoir un menu un peu mieux étiré dans l'espace qui lui est réservé tant sous IE que Mozilla et ne pas avoir de deuxième scroll. Avant il n'apparaissait qu'en 800-600 mais je ne considérait pas cela comme étant bien grave.

Voilà, tu as un état de la situation. J'ai envoyé les pages sur le site ce qui te permettra de constater de visu le pb avant de le commenter si tu en a le temps.

En attendant de tes nouvelles, je te remercie par avance. Herspear.

le site : http://domainedevillaine.free.fr
Pages :