Mettre un pied de page (footer) fixe

  • Statut : non résolu
15 sujets de 16 à 30 (sur un total de 39)
  • Auteur
    Messages
  • #819936
    elisephoto
    Participant
    Initié WordPress
    23 contributions

    Bonsoir,

    Aucune des deux solutions ne fonctionnent car le menu reste scotché sur la gauche. la barre grise n’est pas centre :( Je suis désolée…

    #819939
    christofes
    Participant
    Chevalier WordPress
    103 contributions

    bonsoir

    tu n’as pas à être désolée, toutes les modifications que je t’ai proposé fonctionne sur mon site, normalement pour mettre la largeur de ton menu comme celle de ton site et le centrer, il faut intervenir sur #menu, comme te l’avais proposé Web4Space.

    essai cette modification, dans la 1ere solution j’ai mis margin-left et margin-right en auto pour centrer, dans la 2eme solution même chose mais avec text-align pour center

    1ere solution

    #menu, #menu-menu, .menu, .menu-footer {
    width: 1160px;
    margin-left: auto;
    margin-right: auto;
    }
    
    #menu {
    margin: 0px  auto;
    border-right: 1px solid #cccccc;
    border-left: 1px solid #cccccc;
    -moz-box-shadow: 1px 4px 20px #dddddd;
    -webkit-box-shadow: 1px 4px 20px #dddddd;
    box-shadow: 1px 4px 20px #dddddd;
    position: fixed;
    bottom: 0px;
    }
    
    #menu div.menu, #menu div.menu-footer {
    background-color: #777;	
    border-bottom-style: double; 
    border-bottom-color: #777; 
    border-bottom-width: 0px;
    border-top-style: double; 
    border-top-color: #777; 
    border-top-width: 0px;
    }

    2eme solution

    #menu, #menu-menu, .menu, .menu-footer {
    width: 1160px;
    text-align: center;
    }
    
    #menu {
    margin: 0px  auto;
    border-right: 1px solid #cccccc;
    border-left: 1px solid #cccccc;
    -moz-box-shadow: 1px 4px 20px #dddddd;
    -webkit-box-shadow: 1px 4px 20px #dddddd;
    box-shadow: 1px 4px 20px #dddddd;
    position:fixed;
    bottom: 0px;
    }
    
    #menu div.menu, #menu div.menu-footer {
    background-color: #777;	
    border-bottom-style: double; 
    border-bottom-color: #777; 
    border-bottom-width: 0px;
    border-top-style: double; 
    border-top-color: #777; 
    border-top-width: 0px;
    }

    #819940
    christofes
    Participant
    Chevalier WordPress
    103 contributions

    Explication du script, ton menu est comme ceci :

    dans la 1ere ligne des modifications (#menu, #menu-menu, .menu, .menu-footer), je force les 4 CSS (id et class) à avoir la même largeur (width) et qu’elles soient centrées

    #819941
    Web4Space
    Membre
    Chevalier WordPress
    278 contributions

    Alors, plusieurs chose à faire:

    -Déplacer le style #menu, pour le mettre dans la div #wrapper
    Juste après

    et entre

    -Puis mettez le style suivant au #menu:

    #menu {
    border-left: 1px solid #CCCCCC;
    border-right: 1px solid #CCCCCC;
    bottom: 0;
    margin-left: -81px;
    position: fixed;
    text-align: center;
    width: 1160px;
    }

    #819942
    elisephoto
    Participant
    Initié WordPress
    23 contributions

    va falloir que je réessaye car ca ne fonctionne pas :(

    #819943
    Web4Space
    Membre
    Chevalier WordPress
    278 contributions

    Pensez bien à remplacer le style #menu par le nouveau, et aussi, à déplacer la div #menu

    #819944
    elisephoto
    Participant
    Initié WordPress
    23 contributions

    Bonsoir,

    1 semaine que je suis sur ce foutu menu:fire:

    J’aimerais vous demander une faveur… pourriez vous me l’éditer en css que je puisse ensuite le mettre directement parce que la je n’y arrive vraiment pas.

    J’espère ne pas trop abuser de votre temps mais je vous remercie dans tous les cas.
    Elise

    #819946
    Web4Space
    Membre
    Chevalier WordPress
    278 contributions

    @elisephoto, envoyez moi le dossier du thème en MP.
    Je vous le renvoi fini dans la journée

    #819947
    Guy
    Participant
    Maître WordPress
    14833 contributions

    je met mon grain de sel 🙂

    mais en spécifiant une largeur au body avec une marge auto, et une largeur au menu, cela devrait le faire et permettre de centrer. Si il n’y a pas de largeur définie pour le body, le menu ne saura jamais sur quoi se baser pour se centrer.

    body {
        background: url(“images/bg.png”) repeat scroll 0 0 #EEEEEE;
        color: #B4B4B4;
        font-family: ‘GFS Neohellenic’,”Palatino Linotype”,Palatino,Palladio,”URW Palladio L”,”Book Antiqua”,Baskerville,”Bookman Old Style”,”Bitstream Charter”,”Nimbus Roman No9 L”,Garamond,”Apple Garamond”,”ITC Garamond Narrow”,”New Century Schoolbook”,”Century Schoolbook”,”Century Schoolbook L”,Georgia,serif;
        font-size: 0.9em;
        line-height: 1.3em;
        text-align: left;
        text-shadow: 0 0 1px #FFFFFF;
    
       margin: auto;   /* à modifer */
       width: 1160px; /* à modifer */
       
    }
    
    #menu {
        border-left: 1px solid #CCCCCC;
        border-right: 1px solid #CCCCCC;
        bottom: 0;
        margin: 0 auto;
        position: fixed;
        text-align: center;
    
        width: 1160px;  /* à modifer */
    }

    #819948
    Web4Space
    Membre
    Chevalier WordPress
    278 contributions

    @Guy, le code que j’ai donné marche très bien.
    Il faut juste ensuite déplacer une div

    #819949
    Guy
    Participant
    Maître WordPress
    14833 contributions

    🙂 j’ai pas dit que cela ne marchait pas, mais à priori elle n’y arrive pas puisque cela fait une semaine que cela dure selon ce qu’elle a dit.
    Sinon, en général, je préfère ne pas toucher au code quand c’est possible à résoudre par deux lignes dans le css (bon, le coup des deux lignes ça reste à vérifier 🙂 ).

    #819945
    Web4Space
    Membre
    Chevalier WordPress
    278 contributions

    😉
    C’est pour cela, que si elle veux, je peux effectuer les modifications, en mêmes pas 2 minutes 🙂

    #819950
    elisephoto
    Participant
    Initié WordPress
    23 contributions

    Bonjour Web4Space et Guy,

    Je tiens sincèrement à vous remercier pour votre aide! La solution de guy marche à merveille, mon pied de page est bien en bas et centré je vous remercie infiniment !!

    Elise

    #819951
    Guy
    Participant
    Maître WordPress
    14833 contributions

    parfait ✅ donc

    #819952
    elisephoto
    Participant
    Initié WordPress
    23 contributions

    oui merci beaucoup Guy !!

    🙂

15 sujets de 16 à 30 (sur un total de 39)
  • Vous devez être connecté pour répondre à ce sujet.