[Resolu] PB liens non cliquable IE7 / MOZILLA

Bonjour,

Je ne comprends pas sur IE ca fonctionne sur Mozilla ca veut pas
la petite navigation s'affiche et les liens fonctionnent, sur mozilla ils s'affichent mais ne sont pas cliquables !
et j'ai le pied de page qui ne veut plus rester au milieu sous mozilla

Si quelqu'un veut bien regarder le code et me dire où je me suis trompée , d'avance merci
Là je ne vois plus, j'ai déjà corrigé bon nombre de mes aneries mais celle-là résiste , surtout qu'en grande débutante ... pas facile

Merci d'avance

Voici la page sur espace de travail
http://bertrand.gdt.free.fr
et un exemple de page où il y a la navigation
http://bertrand.gdt.free.fr/parution/articles-8F/flavours-from-france-8-huitres.html
et le css

body {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 0.8em;
margin: 0;
padding: 0;
background: url(images/F4-fond-page.jpg) repeat center top ;}

#header {
height: 118px;
margin-left: 35px;
background: url(images/F1-logo-fond-rouge.jpg) no-repeat left top ;}

#zoneClic {    /* zone cliquable */
float: left;
width : 262px;
height: 118px;
margin-left: 0px;
margin-top: 0px;
}
#headerbas {
height: 118px;
margin-left: 35px;
background: url(images/F3-Fhautvignettes.jpg) no-repeat left top ;
}
#headerbasE {
height: 118px;
margin-left: 35px;
background: url(images/E3-Fhautvignettes.jpg) no-repeat left top ;
}
#headerpub {
height: 117px;
width:412px;
margin-left: 262px;
margin-top:1px;
background-color: #C60021;}

#conteneur {
position: relative;
width: 750px;
margin: 0 auto; 
}
#navigation {
margin-left: 45px;
color:#FFFFFF;
margin-bottom:10px;
font-size: 0.7em;}

#centre {
margin-left: 35px;
}

.couverture {
  float: left;
  width: 30%;
  margin-left: 100px;
}
.textcouv {
  margin-left: 45%;
  }
.couv-article {
  float: left;
  margin-left: 130px;
}
.textarticle {
  margin-left: 10%;
width: 450px; }

hr {
  clear: both;
  width: 50%;
  color: #6B655A;
  }

#centre2 {
margin-left: 35px;
background-color:#FFFFFF;
width: 675px;
}
#gauche {
position: absolute;
left:0;
width: 150px;
}
#pied {
height: 30px;
margin-left:30px;
}
.menugauche {
list-style-type: none;
margin: -50px;
padding-top:50px;
}
.menugauche li {
margin-bottom: 5px;
height: 20px;
background-image: url(images/menu.jpg);
background-position: left;
background-repeat: no-repeat;
padding: 5px 0px 0px 5px
}
.menugauche a {
margin: 0 2px;
height: 35px;
text-decoration: underline;
font-family: Helvetica, arial, sans-serif;
font-size: 12px;
color: #FFFFFF;
font-weight:bold;
}
.menugauche a:hover {
text-decoration: underline;
color: #FFFF33;
}
.menugauche li:hover {
background-image: url(images/menu-hover.jpg);
background-position: left;
background-repeat: no-repeat;
padding: 5px 0px 0px 5px
}

p {margin: 0 0 10px 0;}
.texte {font-family: Helvetica,arial sans-serif; font-size: 10px; color: #314396;}
.textearticle {font-family: Helvetica,arial sans-serif; font-size: 12px; color: #000000;}
.note {font-family: Helvetica,arial sans-serif; font-size: 8px; color: #808080;}
.titre {font-family: Helvetica,arial sans-serif; font-size: 14px; color: #314396;}
.texte3 {font-family: Helvetica,arial, sans-serif; font-size: 14px; color:#FFFFFF;}
.texterouge {font-family: Helvetica,arial, sans-serif; font-size: 14px; color:#FF0000;}
.textenoir {font-family: Helvetica,arial, sans-serif; font-size: 14px; color:#000000;}
.date {font-family: Helvetica,arial, sans-serif; font-size: 12px; font-weight:bold;color: #000000;}
.nomsalon {font-family: Helvetica,arial, sans-serif; font-size: 15px; font-weight:bold;color: #000000;}
.salon {font-family: times,arial, sans-serif; font-size: 11px; font-weight:bold;color: #000000;}

Modifié par marmotte125 (01 May 2007 - 10:30)

Salut,
Premièrement bienvenue sur Alsacreations....

En analysant le site j'ai découvert le petit truc qui gâche tout
concernant les liens de navigation...
En fait c'est le menu de gauche qui casse tout. Je m'explique.
Les liens de navigations sont en fait inatteignables parce que le menu
de gauche est superposé par dessus. On pourrait le faire par exemple en float
(c.f. tutos--> on y trouve des quantités d'informations pour créer des sites et autres trucs),
ou réduire les marges du menu de gauche.

En général encore une petite remarque: le site se charge beaucoup trop lentement... (passé une 1sec avec le haut débit...).
En général les visiteurs n'aiment pas du tout un site long à se charger...donc il faut optimiser.
Une première piste: les images!!! Il réduire leur poids...pas plus que quelques ko au maximum.

Voilà j'espère que j'ai un peu pu t'être utile.
Modifié par climax (30 Apr 2007 - 21:06)

Il faudrait assassiner sauvagement la ligne suivante (celle en rouge) :

.menugauche {
	list-style-type: none;
	[#red]margin: -50px;[/#]
	padding-top:50px;
}

Demander une marge supérieure négative de -50px, une marge de droite négative de -50px, une marge inférieure négative de -50px, et une marge de gauche négative de -50px... tout ça à la fois... pas étonnant que les navigateurs y perdent leur latin.

Tu pourrais corriger ainsi :

.menugauche {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

À partir de là, faire les modifications nécessaires (rajouter une marge -- en évitant de jongler avec des marges négatives, SVP ! --, jouer sur la largeur du bloc, etc.).

Merci,

J'ai assassiné sauvagement la ligne rouge

corrigé à droite à gauche et ca roule !
C'est pas parfait, j'avoue que les différences d'affichage m'énerve au plus haut point ! mais ca ira !

Sinon pour les images, je vais corriger ca dans la foulée !
et dire que je rale contre mes clients quand leurs images sont trop lourdes ! je vais me flageller toute seule

Merci encore
Bon 1er mai