Sous-menu disparaître du menu lorsque la page de défilement

Question

J'ai un problème avec la position du sous-menu, lorsque j'ouvre le sous-menu de la page est bien positionné mais le problème est lorsque je défile la page et que d'essayer d'ouvrir le sous-menu est hors position.

live demo

.has-sub.parent .wrapper { 
    position: fixed; 
    z-index:500; 
} 

Je sais que ce problème est causé par l'utilisation de la position: fixe, mais si je tente de changer ce que le sous-menu est représentée derrière div contenu, j'ai essayé de résoudre ce problème avec z-index, mais cela n'a pas aidé, toute suggestion serait géniale.

Answer 1

Pour être honnête, votre violon est un peu désordonné ... Vous ne pouvez pas utiliser une position fixe pour votre sous-menu. Vous devriez utiliser la position "absolue".

-je ajouter ceci à votre CSS pour modifed un peu toute votre barre de navigation:

.horizontalni li {position:relative;} 
.navigation {z-index:100; ;} 
.has-sub.parent .wrapper {position: absolute;} 
.horizontalni {overflow:visible;max-width:100%} 
body {margin:0; padding:0; overflow:hidden;} 

et là, vous avez votre exemple modifié: http://jsfiddle.net/gtw781sv/1/

L'espoir peut vous aider un peu.

Modifié: débordement de changement: caché overflow: auto dans "corps" si vous voulez vérifier avec les barres de défilement

Answer 2

Salut Vérifiez la démo ici

http://jsfiddle.net/adarshkr/gtw781sv/4/

Les changements effectués dans CSS

.horizontalni .has-sub .has-sub1 .wrapper{left:100%} /* Updated code */