Forum : Menu vertical qui prend toute la hauteur de la page

Bonjour,

Je travaille actuellement sur un thème wordpress custom. J'utilise bootstrap pour avoir un thème completement responsive.
J'ai fais en sorte que mon menu ne soit pas horizontal mais vertical, pour le moment pas de soucis.
Sauf que j'aimerai que mon menu parte du haut de ma page et descende j'usqu'en bas, et cela pour n'importe quel taille d'écran. Qu'il prenne toute la hauteur de la page.

Je n'arrive pas à faire en sorte que mon menu reste "collé" au bas de ma page...

Quelqu'un sait comment je dois m'y prendre ? J'ai essayé en faisant un height:100%; sur mon menu mais cela ne fonctionne pas...

Merci

MrCastor

Salut,

Si tu veux que ton menu fasse l'intégralité de la hauteur de ta page et qu'il ne bouge pas même en scrollant :

nav {
    position: fixed;
    height: 100%;
}

Louis2304

Hello,

Tu veux un gros, que le menu soit collé au bas de ta page ? Du coup je te conseil le code de Bootstrap (http://getbootstrap.com/examples/sticky-footer-navbar/)

<footer class="footer">
      <div class="container">
        <p class="text-muted">Tu peux mettre le code d'une navbar ici par exemple. :)</p>
      </div>
    </footer>

skank

peux etre que ça marche

    .menu{
       position:fixed;
       top:0;
       bottom:0;
       left:0;
       width:100px
    }

sinon avec un peux de js

   $('.menu').css('height', $(window).height()+'px');

Flitflit

Tu as aussi en css height : 100vh

Tralala8

Salut chnouky,

Est-ce que ceci ressemble à ce que tu veux faire ?

balo

Si tu veux mettre une hauteur de 100%, il faut que tous les éléments parents aient une hauteur définie également (jusqu'à la balise "html").

html, body, .menu {
    height: 100%
}

Kiv

Je pense qu'en JS ça fera l'affaire

// Récupère la hauteur de l'écran
var MenuHeight = $(window).height();

// Ensuite, ajoute la valeur à ton menu
$('#MyMenu').css("height",MenuHeight);

Désormais ton menu prend toute la hauteur de ton écran

mxmaxime

Utiliser du js pour ça? Mh mauvaise idée.

Defy

Utiliser du js pour ça? Mh mauvaise idée.

et de plus inutile complet

Menu vertical qui prend toute la hauteur de la page

9 réponses