Loading ...
Sorry, an error occurred while loading the content.

Centering the menu items in a menubar

Expand Messages
  • Gia Raz
    Hi all, How can I center the menu items in a menubar? The code below center menubar items in browser s window and hides menubar
    Message 1 of 5 , Feb 3, 2010
    • 0 Attachment
      Hi all,

      How can I center the menu items in a menubar?
      The code below center menubar items in browser's window and hides menubar

      <div id="naviagation">
        <div id="mymenubar" class="yuimenubar yuimenubarnav" style="position: absolute;">
          <div class="bd">
          ....
          </div>
        </div>
      </div>

      ....
       
       var oMenuBar = new YAHOO.widget.MenuBar("mymenubar",
           {autosubmenudisplay: true, position: "dynamic", visible:true,fixedcenter:true,
           constraintoviewport: true,container:"naviagation" });
          
      Any help, please?

      Thanks,

      gia

    • Satyam
      As you ve noticed, YUI controls are generously laced with classNames. With some sort of DOM inspector you need to find out what style applies to the elements
      Message 2 of 5 , Feb 3, 2010
      • 0 Attachment
        As you've noticed, YUI controls are generously laced with classNames.  With some sort of DOM inspector you need to find out what style applies to the elements you want to center and override that style with the settings you want.  This article uses DataTable as an example, but the principle and the tools apply just as well:

        http://www.satyam.com.ar/yui/widgetstyles.html

        Satyam

        El 03/02/2010 10:39, Gia Raz escribió:
        Hi all,

        How can I center the menu items in a menubar?
        The code below center menubar items in browser's window and hides menubar

        <div id="naviagation">
          <div id="mymenubar" class="yuimenubar yuimenubarnav" style="position: absolute;">
            <div class="bd">
            ....
            </div>
          </div>
        </div>

        ....
         
         var oMenuBar = new YAHOO.widget.MenuBar("mymenubar",
             {autosubmenudisplay: true, position: "dynamic", visible:true,fixedcenter:true,
             constraintoviewport: true,container:"naviagation" });
            
        Any help, please?

        Thanks,

        gia

        No virus found in this incoming message. Checked by AVG - www.avg.com Version: 9.0.733 / Virus Database: 271.1.1/2664 - Release Date: 02/02/10 20:35:00
      • Gia Raz
        Thank for attention. The position of a menubaritem is controled by .yuimenubaritem { float: left; } so I can move menubaritems inside of menubar left or right
        Message 3 of 5 , Feb 3, 2010
        • 0 Attachment
          Thank for attention.
          The position of a menubaritem is controled by

          .yuimenubaritem {
              float: left;
          }

          so I can move menubaritems inside of menubar left or right only?!


          From: Satyam <satyam@...>
          To: ydn-javascript@yahoogroups.com
          Sent: Wed, February 3, 2010 2:43:16 PM
          Subject: Re: [ydn-javascript] Centering the menu items in a menubar

           

          As you've noticed, YUI controls are generously laced with classNames.  With some sort of DOM inspector you need to find out what style applies to the elements you want to center and override that style with the settings you want.  This article uses DataTable as an example, but the principle and the tools apply just as well:

          http://www.satyam. com.ar/yui/ widgetstyles. html

          Satyam

          El 03/02/2010 10:39, Gia Raz escribió:

          Hi all,

          How can I center the menu items in a menubar?
          The code below center menubar items in browser's window and hides menubar

          <div id="naviagation">
            <div id="mymenubar" class="yuimenubar yuimenubarnav" style="position: absolute;">
              <div class="bd">
              ....
              </div>
            </div>
          </div>

          ....
           
           var oMenuBar = new YAHOO.widget. MenuBar(" mymenubar" ,
               {autosubmenudisplay : true, position: "dynamic", visible:true, fixedcenter: true,
               constraintoviewport : true,container: "naviagation" });
              
          Any help, please?

          Thanks,

          gia

          No virus found in this incoming message. Checked by AVG - www.avg.com
          Version: 9.0.733 / Virus Database: 271.1.1/2664 - Release Date: 02/02/10 20:35:00


        • Satyam
          I am not sure what effect you are looking for, but I thought it was text-align. Anyway, the best thing to do is to use the DOM to change the styles and see
          Message 4 of 5 , Feb 3, 2010
          • 0 Attachment
            I am not sure what effect you are looking for, but I thought it was text-align.  Anyway, the best thing to do is to use the DOM to change the styles and see the effect right there on the browser.

            Satyam

            El 03/02/2010 13:05, Gia Raz escribió:
            Thank for attention.
            The position of a menubaritem is controled by

            .yuimenubaritem {
                float: left;
            }

            so I can move menubaritems inside of menubar left or right only?!


            From: Satyam <satyam@...>
            To: ydn-javascript@yahoogroups.com
            Sent: Wed, February 3, 2010 2:43:16 PM
            Subject: Re: [ydn-javascript] Centering the menu items in a menubar

             

            As you've noticed, YUI controls are generously laced with classNames.  With some sort of DOM inspector you need to find out what style applies to the elements you want to center and override that style with the settings you want.  This article uses DataTable as an example, but the principle and the tools apply just as well:

            http://www.satyam. com.ar/yui/ widgetstyles. html

            Satyam

            El 03/02/2010 10:39, Gia Raz escribió:

            Hi all,

            How can I center the menu items in a menubar?
            The code below center menubar items in browser's window and hides menubar

            <div id="naviagation">
              <div id="mymenubar" class="yuimenubar yuimenubarnav" style="position: absolute;">
                <div class="bd">
                ....
                </div>
              </div>
            </div>

            ....
             
             var oMenuBar = new YAHOO.widget. MenuBar(" mymenubar" ,
                 {autosubmenudisplay : true, position: "dynamic", visible:true, fixedcenter: true,
                 constraintoviewport : true,container: "naviagation" });
                
            Any help, please?

            Thanks,

            gia

            No virus found in this incoming message. Checked by AVG - www.avg.com Version: 9.0.733 / Virus Database: 271.1.1/2664 - Release Date: 02/02/10 20:35:00

            No virus found in this incoming message. Checked by AVG - www.avg.com Version: 9.0.733 / Virus Database: 271.1.1/2664 - Release Date: 02/02/10 20:35:00
          • Gia Raz
            .yuimenubaritem is used for tag. I cannot center it with text-align. The position of menuitems is controled with float property: float: left move all
            Message 5 of 5 , Feb 3, 2010
            • 0 Attachment
              .yuimenubaritem is used for <li> tag. I cannot center it with text-align.
               The position of menuitems  is controled with 'float' property: 'float: left'
               move all menuitems left and 'float: right' moves right.
               I cannot find any possibility to center menuitems.
              gia


              From: Satyam <satyam@...>
              To: ydn-javascript@yahoogroups.com
              Sent: Wed, February 3, 2010 4:16:39 PM
              Subject: Re: [ydn-javascript] Centering the menu items in a menubar

               

              I am not sure what effect you are looking for, but I thought it was text-align.  Anyway, the best thing to do is to use the DOM to change the styles and see the effect right there on the browser.

              Satyam

              El 03/02/2010 13:05, Gia Raz escribió:

              Thank for attention.
              The position of a menubaritem is controled by

              .yuimenubaritem {
                  float: left;
              }

              so I can move menubaritems inside of menubar left or right only?!


              From: Satyam <satyam@satyam. com.ar>
              To: ydn-javascript@ yahoogroups. com
              Sent: Wed, February 3, 2010 2:43:16 PM
              Subject: Re: [ydn-javascript] Centering the menu items in a menubar

               

              As you've noticed, YUI controls are generously laced with classNames.  With some sort of DOM inspector you need to find out what style applies to the elements you want to center and override that style with the settings you want.  This article uses DataTable as an example, but the principle and the tools apply just as well:

              http://www.satyam. com.ar/yui/ widgetstyles. html

              Satyam

              El 03/02/2010 10:39, Gia Raz escribió:

              Hi all,

              How can I center the menu items in a menubar?
              The code below center menubar items in browser's window and hides menubar

              <div id="naviagation">
                <div id="mymenubar" class="yuimenubar yuimenubarnav" style="position: absolute;">
                  <div class="bd">
                  ....
                  </div>
                </div>
              </div>

              ....
               
               var oMenuBar = new YAHOO.widget. MenuBar(" mymenubar" ,
                   {autosubmenudisplay : true, position: "dynamic", visible:true, fixedcenter: true,
                   constraintoviewport : true,container: "naviagation" });
                  
              Any help, please?

              Thanks,

              gia

              No virus found in this incoming message. Checked by AVG - www.avg.com
              Version: 9.0.733 / Virus Database: 271.1.1/2664 - Release Date: 02/02/10 20:35:00


              No virus found in this incoming message. Checked by AVG - www.avg.com
              Version: 9.0.733 / Virus Database: 271.1.1/2664 - Release Date: 02/02/10 20:35:00


            Your message has been successfully submitted and would be delivered to recipients shortly.