[PHPBB2] Barre de navigation

Bonjour,

J'ai un soucis sur les navigateurs web. La barre de navigation reste à la bonne place (fixe) sur firefox mais concernant les autres navigateurs web; lorsqu'on on descend ou monte, il y a comme un vibrement sur la page, elle suit le mouvement du scroll avec un effet de tremblement sans rester fixe et ça se répercute sur les images du body.

Voici le code css de la barre de navigation :

Code:

/* NAVIGATION */
.navSIT {
top:100px; margin-left:880px; /* MODIFIABLE - DETERMINE LA POSITION */
line-height:10px;
  z-index: 999 !important;
 position: fixed;
box-sizing:border-box;

}
.mainmenu img{
display:none;

}  

/* LIENS NAVIGATION */
.navSIT a.mainmenu {
display:block; margin-bottom:5px;
width:135px; padding:10px 5px; border-radius:40px;
text-align:center; line-height:normal;
text-transform:uppercase; font-size:12px; font-family:Arial; /* MODIFIABLE */
background:rgba(207, 179, 179, 0.8); color:white; /* MODIFIABLE */
opacity:0.8;
transition:opacity .55s ease;
-webkit-transition:opacity .55s ease;  
-moz-transition:opacity .55s ease;
-o-transition:opacity .55s ease;
 z-index: 999;

}
/* COULEURS ALTERNATIVES */
.navSIT a.mainmenu:nth-of-type(even) {
background:rgba(255,255,255,0.5); color:grey; /* MODIFIABLE */
}
/* SURVOL LIEN NAVIGATION */
.navSIT a.mainmenu:hover {
opacity:1;
}

/* DECONNEXION */
a#logout.mainmenu {
font-size:0px;
}
a#logout.mainmenu::after {
display:inline-block; vertical-align:middle;
font-size:12px !important; content:'Déconnexion'; /* MODIFIABLE */
}
/* MENU RECHERCHE */
#search_menu {
top:55px !important; left:175px !important;
}
/* COULEUR FOND MENU RECHERCHE */
#search_menu td.row2 {
background:lightgrey !important; font-family:Arial; /* MODIFIABLE */
}
/* COULEUR TEXTE MENU RECHERCHE */
#search_menu td.row2 span.genmed {
color:black !important; /* MODIFIABLE */
}
/* TITRE MENU RECHERCHE */
#search_menu th.thHead {
text-transform:uppercase; font-family:Arial; /* MODIFIABLE */
background:black; color:white; /* MODIFIABLE */
}
/* BARRE MENU RECHERCHE */
#search_menu input.post {
height:23px !important; border:none !important;
background:white; color:black; /* MODIFIABLE */
}
/* BOUTON MENU RECHERCHE */
#search_menu input.button {
height:25px; border:none !important; text-transform:uppercase;
background:black; color:white !important; /* MODIFIABLE */
}
/* RECHERCHE AVANCEE */
#search_menu a{
display:block; margin-bottom:5px; width:235px;
background:none !important; border:none !important;
text-transform:uppercase; font-weight:bold; color:black !important; /* MODIFIABLE */
}
   /********************************************* FIN NAVIGATION *********************************************/

Merci de bien vouloir m'aider parce que je ne sais plus comment faire

Bonne journée

Hello Kaeyla ,

hum il manque le principal, le template concerné et pourquoi encore cacher le style,
on en trouve tous les jours des similaires!!!!!!!!!!!
Je vais donc éditer ton message et le mettre en clair car c'est mon principe.
Lorsque l'on vient demander de l'aide, la moindre des choses et de donner un maximum
de renseignements et donc afficher le contenu, sur le forum des forums, je ne répond pratiquement jamais sur de tels sujets.

Ça me met hors de moi

Voici l'emplacement de la barre de navigation placé dans le template overall header juste avant :

Code:

<div style="clear: both;"></div>

Code:

  <table cellspacing="0" cellpadding="0" border="0" align="{MENU_POSITION}" class="navSIT">
<tr><td align="{MENU_POSITION}"{MENU_NOWRAP}>{GENERATED_NAV_BAR}</td></tr>
</table>

Merci Kaeyla,

je ne rencontre pas de problème de mon côté, je crois que tu avais fait une demande concernant les iframes, il faudrait peut être voir de ce côté

Hello Phil.,

J'ai retiré les iframes et j'ai toujours le même problème sur internet explorer.

Effectivement , c'est assez étonnant cette histoire, je regarde tout cela demain matin chère amie

Hello Phil.,

Bonne fin de soirée

A demain cher ami

Hello Kaeyla ,
je viens de tester sur mon fofo et je n'ai pas de soucis, le soucis vient d'ailleurs chère amie.
Ton template overal_header doit être très chargé si je ne trompe pas.
Tu peux me donner ce dernier stp

en attendant,
comme je l'ai toujours mentionné,
il ne faut jamais positionner une table en pixels mais avec un pourcentage et il est préférable d'utiliser un left plutôt qu'un margin-left ici:

Code:

margin-left:880px;

En

Code:

left:80%;

Code:


/* NAVIGATION */
.navSIT {
top:100px;
margin-left:880px; /* MODIFIABLE - DETERMINE LA POSITION */
line-height:10px;
  z-index: 999 !important;
 position: fixed;
box-sizing:border-box;

}

Pour retirer les images de la barre de navigation, il est préférable de donner la balise avec la class Kaeyla :

Code:


.mainmenu img{
display:none;

} 


En

Code:

a.mainmenu img{
display:none;

} 

Hello Phil.,

Ça marche super bien. Merci pour le % de la marge corrigé parce que je voulais récemment changer tous les "margin" avec le % mais le changement ne se faisait pas à cause d'avoir gardé "margin-left" ou "margin-right". Je n'avais pas fait attention à cette différence entre % et px.

Sinon comme tu m'as expliqué que le problème vient du template overall Header alors j'ai modifié l'emplacement de la barre. Et ça marche impeccable.

Merci bcp et bonne journée cher ami.