Menu haut

Réduire
X
 
  • Filtrer
  • Heure
  • Afficher
Tout effacer
nouveaux messages

  • Menu haut

    Bonjour à toute la communauté,
    J'ai fais la migration de 1.5 vers 2.5. et récupérer le CSS de template pour 2.5.

    Alors que sous 1.5 j'avais ce type de menu haut :




    Sous 2.5, j'ai les boutons de menu qui se trouvent au milieu du texte de la page :



    Le CSS du template arrive de chez Siteground, c'est le GreenField que j'ai ensuite modifié.
    J'ai comparé les deux sections de CSS concernant les dimensions du menu, elles sont semble-t-il identiques.

    Petit extrait du CSS version 2.5 :
    Code:
    .top-menu{background:url(../images/top_menu1.jpg) no-repeat scroll left top transparent;height:33px;line-height:45;margin:0 auto 17px;padding:12px 0;width:960px}
    .maincol,.maincol_w_right,.maincol_w_left{width:960px;margin:0 auto;padding:0}
    Extrait du CSS version 1.5 :
    Code:
    #top_menu{
    	background: url(../images/top_menu1.jpg) top left no-repeat;
    	height:33px;
    	line-height:45;
    	width:960px;
    	padding:12px 0;
    	margin:0 auto 17px auto;

    Savez-vous d'où peut provenir ce désordre ?

    Merci pour votre contribution.
    Dernière édition par bixente à 04/12/2012, 17h27 Raison: faute d'accord

  • #2
    Re : Menu haut

    Dans le fichier index.php, j'ai ce code au sujet de Top_menu :
    Code:
    <div class="top-menu">
    		<div id="sgmenu">
    		<table cellspacing="0" cellpadding="0" border="0" style="margin:0 auto;">
    		<tr>
    		<td>
    			<jdoc:include type="modules" name="menuload" />
    		</td>	
    		</tr>	
    		</table>
    		</div>
    Dois-je le modifier pour faire apparaître le menu correctement ?
    Et sur quelle valeur dois-je jouer ?

    Merci pour votre contribution.

    Commentaire


    • #3
      Re : Menu haut

      essaye

      .top_menu{
      background: url(../images/top_menu1.jpg) top left no-repeat;
      height:33px;
      line-height:45;
      width:960px;
      padding:12px 0;
      margin:0 auto 17px auto;
      ...
      }

      la div dans la version 1.5 est un id alors que c'est une classe dans la version 2.5

      regarde aussi la classe .sgmenu elle doit contenir un width:100% pour qu'elle remplisse toute la div .top_menu

      et si ça marche, je pense que tu n'as pas besoin

      <table cellspacing="0" cellpadding="0" border="0" style="margin:0 auto;">
      <tr>
      <td>
      <jdoc:include type="modules" name="menuload" />
      </td>
      </tr>
      </table>

      seulement <jdoc:include type="modules" name="menuload" /> dans la div sgmenu
      Christophe
      http://www.webcrea.fr

      Commentaire


      • #4
        Re : Menu haut

        Merci webcrea pour avoir pris le temps de m'aider.
        Je viens d'essayer de modifier le CSS par ce que tu me proposes en premier, cela n'a rien modifié au menu, toujours décalé.

        Pour .sgmenu, je n'ai trouvé que ça, où dois-je mettre width:100%, à la place de width:auto ?
        Merci

        Code:
        /* sgmenu */#sgmenu{display:table;margin:0 auto}
        #sgmenu ul.menu:after{clear:both;content:"";display:block}
        #sgmenu ul.menu{float:right;padding:0 10px}
        #sgmenu ul li{float:left;position:relative}
        #sgmenu ul li a{display:block;white-space:nowrap}
        #sgmenu ul li ul{position:absolute;visibility:hidden}
        #sgmenu ul li ul li{float:none}
        #sgmenu ul li ul li a{width:auto}
        #sgmenu ul li ul{margin-top:30px;z-index:500;background:#fff}
        #sgmenu ul.menu li ul li a,#sgmenu ul.menu li ul li a:link,#sgmenu ul.menu li ul li a:visited{background:#fff}
        #sgmenu ul.menu li ul li a span{padding:0 10px}
        #sgmenu ul.menu li ul li a:hover span{color:#000}
        #sgmenu ul.menu li a,#sgmenu ul.menu li a:link,#sgmenu ul.menu li a:visited{background:url(../images/but_l.jpg) no-repeat scroll left center transparent;color:#FFF;cursor:pointer;display:block;float:left;font-family:Tahoma,Verdana,sans-serif;font-size:11px;font-weight:700;height:31px;line-height:31px;margin:0;padding:0 10px}
        #sgmenu ul.menu li a span:hover{text-decoration:underline}
        #sgmenu ul.menu li a span{background:url(../images/but_r.jpg) no-repeat scroll right center transparent;float:left;padding:0 15px 0 5px}

        Commentaire


        • #5
          Re : Menu haut

          ce n'est pas facile d'avoir une idée du rendu... sans rendu est-ce que tu as un lien vers ton site?
          Christophe
          http://www.webcrea.fr

          Commentaire


          • #6
            Re : Menu haut

            Envoyé par webcrea Voir le message
            est-ce que tu as un lien vers ton site?
            Oui,je l'avais mis dans mon premier message.
            Le voici avec le ?tp=1.

            Merci
            Bixente

            Commentaire


            • #7
              Re : Menu haut

              déjà en retirant line-height: 45; de sgmenu

              il va s'afficher en ligne

              et en modifiant

              a, img {
              outline: medium none;
              margin: 0px;
              padding: 5px;
              border: medium none;
              }

              cela va donner de l'air à tes options
              Dernière édition par webcrea à 04/12/2012, 16h47
              Christophe
              http://www.webcrea.fr

              Commentaire


              • #8
                Re : Menu haut

                Bon, webcrea, si je te dis que cela a fonctionné, tu me crois ! Il faut que je développe le Menu maintenant.

                J'ai encore plein de choses à apprendre.
                Merci beaucoup d'avoir pris le temps m'aider webcrea c'est vraiment très sympathique de ta part.

                Bonne soirée à toute la communauté.
                --
                Bixente

                Commentaire


                • #9
                  Re : Menu haut

                  oui je te crois..
                  et pas de soucis pour l'aide quand on peut..
                  bon courage
                  bye
                  Christophe
                  http://www.webcrea.fr

                  Commentaire

                  Annonce

                  Réduire
                  Aucune annonce pour le moment.

                  Partenaire de l'association

                  Réduire

                  Hébergeur Web PlanetHoster
                  Travaille ...
                  X