5 Replies Latest reply on Feb 17, 2010 5:31 AM by Zabeth69

    Making a spry menu work in browsers other than IE

    GuppyFish09

      I am having a hard time getting any vertical spry menu bar work in Safari, FireFox, etc.  They work fine in Internet Explorer.  Any ideas?

       

      Here's an example:  http://midlochorus.org/

       

      Thanks in advance!

       

      Karen

        • 1. Re: Making a spry menu work in browsers other than IE
          Zabeth69 Level 5

          Karen, I fear your enthusiastic use of absolute positioning may be throwing off your vertical menu.

           

          Absolute positioning takes an element out of the normal flow of the page, and unlike relative positioning, in which elements rely on each other, absolutely positioned elements are somewhat tricky.

           

          You may find that your page will work better if you can rework the positioning to use relative positioning. Although that may seem like a large task, you have done much of the work already, and positioning numbers will help.

           

          I picture relative positioning as stacking blocks ... albeit upside down!... starting at the top and working down.

           

          The other element I see is a Flash object, which is equally tricky to run menus over.

           

          Once you get the div that contains the menu into a relative position, then you can worry about the submenus showing over the Flash element.

           

          Beth

          • 2. Re: Making a spry menu work in browsers other than IE
            mahendra rajeshirke Level 2

            hi GuppyFish123 ur page menus dont look perfectly in mozilla, i think ur submenu's width and height is not defined, or defined as "auto"

             

             

            GuppyFish123 wrote:

             

            I am having a hard time getting any vertical spry menu bar work in Safari, FireFox, etc.  They work fine in Internet Explorer.  Any ideas?

             

            Here's an example:  http://midlochorus.org/

             

            Thanks in advance!

             

            Karen

            • 3. Re: Making a spry menu work in browsers other than IE
              GuppyFish09 Level 1

              Thanks, Beth.

               

              Like many others, I learned web design using tables and am trying to learn CSS.  I am working on changing the positioning to relative, but now the page is all wonky.  The left and top numbers are the same, but the nav bar is all over the place.

               

              For what it's worth, I opened a new file and inserted a dummy vertical spry bar by itself with NO CSS... just at the top of the page, and I'm having the same problem.  The menu will not expand in FF.  I'll attach the document, and you can take a look.

               

              As far as the flash issue is concerned, I had read about that problem.  Fortunately, the only menu item that I wish to expand is not anywhere close to the fash object, so I'm hoping it won't be a problem in this case.

               

              Thanks so much for your willingness to help!

               

              Karen

              • 4. Re: Making a spry menu work in browsers other than IE
                GuppyFish09 Level 1

                I will also look at the submenu... thanks, Mahendra.

                • 5. Re: Making a spry menu work in browsers other than IE
                  Zabeth69 Level 5

                  That's a good technique for spotting errors in a menu bar. I have just put together a working page for analyzing menubars, too. If it doesn't work on the blank page, you know there's something going on in the menubar itself, not on the page.

                   

                  But looking at the html by itself does not allow for looking into the CSS for the menubar. The html looks pretty normal, as you probably know!

                   

                  If you can attach the CSS file, I'll put them together and try to spot your trouble.

                   

                  Beth