CSS drop-down menu not showing firefox

Collapse
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • adz1809
    New Member
    • Dec 2006
    • 27
    #1

    CSS drop-down menu not showing firefox

    Here is the HTML -

    <div id="nav">

    <ul class="level1">
    <li class="submenu" ><a href="../orderflow/control.aspx">O rder Control</a></li>
    <ul class="level2">
    <li><a href="#">Summar y</a></li>
    </ul>
    <li class="submenu" ><a href="#">Produc t Control</a></li>
    <ul class="level2">
    <li><a href="poroduct-add.aspx">Add Product</a></li>
    <li><a href="poroduct-del.aspx">Delet e Product</a></li>
    <li><a href="poroduct-edit.aspx">Edit Product</a></li>
    </ul>
    <li class="submenu" ><a href="#">Suppli er Control</a></li>
    <ul class="level2">
    <li><a href="#">Add Supplier</a></li>
    <li><a href="#">Delete Supplier</a></li>
    <li><a href="#">Edit Supplier</a></li>
    </ul>
    <li class="submenu" ><a href="#">Prog Control</a></li>
    <ul class="level2">
    <li><a href="#">Add Prog</a></li>
    <li><a href="#">Delete Prog</a></li>
    <li><a href="#">Edit Prog</a></li>
    </ul>
    </ul>

    </div>

    Here's the CSS -

    div#nav {
    width:625px;
    margin: 0 auto;
    text-align:left;
    color:#fff;
    padding:120px 0 0 0;
    }

    div#nav a{
    color:#fff;
    text-decoration:none ;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 1.2em;
    }

    div#nav ul.level1 li{
    float:left;
    }

    div#nav ul.level2 {
    margin-top:3px;
    }

    div#nav ul.level2 li{
    clear:both;
    }

    div#nav ul.level1 li a{
    width:155px;
    background-color:#59AEDA;
    display:block;
    text-align:center;
    }

    div#nav ul.level2 li a{
    width:155px;
    padding: 5px 5px 5px 5px;
    voice-family: "\" }\""; voice-family:inherit;
    width:145px;
    background-color:#59AEDA;
    display:block;
    text-align:left;
    }

    div#nav ul.level2 li a:hover{
    width:155px;
    padding: 5px 5px 5px 5px;
    voice-family: "\" }\""; voice-family:inherit;
    width:145px;
    background-color:#66CCFF;
    display:block;
    text-align:left;
    }

    div#nav ul ul{
    display:none;
    }

    div#nav ul.level1 li.submenu:hove r ul.level2 {
    display:block;
    }
    Tags: None
    • adz1809
      New Member
      • Dec 2006
      • 27
      #2
      here's the full HTML -

      <body>

      <div id="holder">

      <div id="header">
      <div id="nav">

      <ul class="level1">
      <li class="submenu" ><a href="../orderflow/control.aspx">O rder Control</a></li>
      <ul class="level2">
      <li><a href="#">Summar y</a></li>
      </ul>
      <li class="submenu" ><a href="#">Produc t Control</a></li>
      <ul class="level2">
      <li><a href="poroduct-add.aspx">Add Product</a></li>
      <li><a href="poroduct-del.aspx">Delet e Product</a></li>
      <li><a href="poroduct-edit.aspx">Edit Product</a></li>
      </ul>
      <li class="submenu" ><a href="#">Suppli er Control</a></li>
      <ul class="level2">
      <li><a href="#">Add Supplier</a></li>
      <li><a href="#">Delete Supplier</a></li>
      <li><a href="#">Edit Supplier</a></li>
      </ul>
      <li class="submenu" ><a href="#">Prog Control</a></li>
      <ul class="level2">
      <li><a href="#">Add Prog</a></li>
      <li><a href="#">Delete Prog</a></li>
      <li><a href="#">Edit Prog</a></li>
      </ul>
      </ul>

      </div>
      </div>

      <div id="frame">

      </div>

      <div id="footer">

      </div>

      </div>


      </body>

        Comment

        • adz1809
          New Member
          • Dec 2006
          • 27
          #3
          any help please? It works to a point IE, but no go at all in Firefox.

          Also it is appearing underneath other page content any help in this would also be great, I tried z-indexing but no joy.

            Comment

            • drhowarddrfine
              Recognized Expert Expert
              • Sep 2006
              • 7434
              #4
              Sorry, I'm gone all week and only have a minute. Get the page working in Firefox. IE has too many bugs. Make sure you have a doctype. aspx files are notorious for being IE-centric and non-standard. Also, validate your html and css.

                Comment

                • hubhamers
                  New Member
                  • Jul 2007
                  • 5
                  #5
                  Originally posted by drhowarddrfine
                  Sorry, I'm gone all week and only have a minute. Get the page working in Firefox. IE has too many bugs. Make sure you have a doctype. aspx files are notorious for being IE-centric and non-standard. Also, validate your html and css.
                  That's easily said: how many people are still using IE6? Only about 38%?

                    Comment

                    • sassygray5
                      New Member
                      • Jul 2007
                      • 5
                      #6
                      Hey, I had a menu just like that before I remodeled my website. I had the same problems... unfortunately I didn't find a solution. That's one reason I remodeled... Did you get the script from Dynamic Drive?

                      Sorry, I'm not much help but, I would suggest just getting another menu.

                        Comment

                        • drhowarddrfine
                          Recognized Expert Expert
                          • Sep 2006
                          • 7434
                          #7
                          Originally posted by hubhamers
                          That's easily said: how many people are still using IE6? Only about 38%?
                          The reason you get pages to work in Firefox first because it is the most standards-compliant browser. IE is riddled with bugs which can fool you and make your page not work in any other browser. So code to standards and test in a modern browser which makes it easier to hack and fix IE.

                            Comment

                            • jimberry
                              New Member
                              • Jul 2007
                              • 11
                              #8
                              Originally posted by hubhamers
                              That's easily said: how many people are still using IE6? Only about 38%?
                              Rather more are using IE7, and that is almost as bad.

                                Comment

                                • jimberry
                                  New Member
                                  • Jul 2007
                                  • 11
                                  #9
                                  Try the dropdown menus from here and here and also look at the "sliding doors" menus

                                    Comment

                                    Previous template Next
                                    Working...