Partage
  • Partager sur Facebook
  • Partager sur Twitter

Positonnement de sous-menus à droite lors du hover

    25 avril 2019 à 18:20:45


    J'ai une barre de menus principale positionnée en haut, avec des menus à gauche et un menu "Mon profil" à droite. Lorsque du hover, des sous-menus s'affichent, positionnés à gauche par rapport à mon menu. Je souhaiterais que les containers de ces sous-menu se positionnent à droite et que les textes à l'intérieur soient eux aussi alignés à droite dans leur container.

    Voici mon code actuel : https://codepen.io/Titouan79/pen/qwLZxr
    Et voici le rendu que je souhaiterais :upload/1556208983-75148-rendu.jpg

    Merci d'avance pour l'aide que vous m'apporterez Smiley biggrin

    -
    Edité par TitouanDev 25 avril 2019 à 20:12:03

    • Partager sur Facebook
    • Partager sur Twitter
    - TitouanDev -
      25 avril 2019 à 22:27:48

      Bonsoir,

      [EDIT]

      Autant pour moi je disait une bêtise

      Ceci devrait être mieux

      .menu-profile li{
        float:right;
        margin-right: 20px;
      }



      -
      Edité par exen 25 avril 2019 à 22:44:20

      • Partager sur Facebook
      • Partager sur Twitter

      Compos sui.

        25 avril 2019 à 23:00:24

        Effectivement, ça fonctionne bien. Mais je souhaiterais que les sous-menu du profil aient la même apparence que ceux des autres menus, or ce n'est pas le cas avec ta technique.

        Pourrez-tu m'aider stp ?

        • Partager sur Facebook
        • Partager sur Twitter
        - TitouanDev -
          25 avril 2019 à 23:07:23

          hop;

          .menu-profile li{
            width:165px;
            float:right;
            margin-right: 20px;
            padding: 14px 30px;
            text-align: right;
          }

          J'avais oublié que tu voulais le texte à droite :D



          -
          Edité par exen 25 avril 2019 à 23:11:14

          • Partager sur Facebook
          • Partager sur Twitter

          Compos sui.

            25 avril 2019 à 23:22:50

            Merci !

            De mon côté, j'ai trouvé cela aussi :

            .menu-profile li {
              float: right;
              width: 100%;
            }
            
            .smenu-profile li a {
              display: flex;
              justify-content: center;
              padding: 14px 15px;
            }
            

            Et ça marche aussi bien !

            Tu peux le voir sur le codepen mis à jour : https://codepen.io/Titouan79/pen/qwLZxr

            -
            Edité par TitouanDev 25 avril 2019 à 23:26:22

            • Partager sur Facebook
            • Partager sur Twitter
            - TitouanDev -
              25 avril 2019 à 23:26:36

              Oui c'est même bien mieux

              comme quoi ; ) perso moi je retourne à la conception de ma glace :D

              si jamais tu veut toujours le texte à droite

              .smenu-profile li a {
                display: flex;
                justify-content: flex-end;
                padding: 14px 15px;
              }

              Bon courage pour la suite.

              -
              Edité par exen 25 avril 2019 à 23:40:39

              • Partager sur Facebook
              • Partager sur Twitter

              Compos sui.

              Positonnement de sous-menus à droite lors du hover

              × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
              • Editeur
              • Markdown