• Hello I am in need of some pointers as I am trying to make a drop down horizontal menu like this https://socialchange.is with the function wp_nav_menu I can only seem to find tutorials using with wp_list function, which is not good to me.

    Thanks

Viewing 5 replies - 1 through 5 (of 5 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    So you have a vertical menu at the moment?

    Thread Starter phillsmile

    (@phillsmile)

    I do not have any menu at the moment, I would like to use the suffusion theme but that all depends on the menu, I can code the css and wp_nav_menu from scratch but I cant find a way

    This code works to a point but I cant get the sub pages to start on the left side of the page, they start below the parent instead.

    nav#nav ul.sf-menu{
                background-color: #202020;
                display: block;
                font-size:1.1em;
                height:30px;
                width:100%;
        }
    
        nav#nav ul.sf-menu,
        nav#nav ul.sf-menu ul {
           line-height: 1;
           list-style: none;
        }
    
        nav#nav ul.sf-menu a ,
        nav#nav ul.sf-menu a:hover{
           border:none;
           display: block;
           text-decoration: none;
        }
    
        nav#nav ul.sf-menu li {
           float: left;
           list-style:none;
        }
    
        nav#nav ul.sf-menu a,
        nav#nav ul.sf-menu a:visited {
           color:#109dd0;
           display:block;
           font-weight:bold;
           padding:6px 12px;
        }
    
        nav#nav ul.sf-menu a:hover,
        nav#nav ul.sf-menu a:active {
           color:#fff;
           text-decoration:none
        }   
    
        nav#nav ul.sf-menu li ul {
    
           height: auto;
           left:auto;
           right:auto;
           position: absolute;
           width: 900px;
        z-index:9999;
        }
    
        nav#nav ul.sf-menu li li {
           width: auto;
           clear:none;
           float:left;
           left:auto;
           right:auto;
        }
    
        nav#nav ul.sf-menu li li a,
        nav#nav ul.sf-menu li li a:visited {
                color:#109dd0;
           font-weight:normal;
           font-size:0.9em;
        }
    
        nav#nav ul.sf-menu li li a:hover,
        nav#nav ul.sf-menu li li a:active {
           color:#fff;
        }   
    
        nav#nav ul.sf-menu li:hover ul,
        nav#nav ul.sf-menu li li:hover ul,
        nav#nav ul.sf-menu li li li:hover ul,
        nav#nav ul.sf-menu li.sfhover ul,
        nav#nav ul.sf-menu li li.sfhover ul,
        nav#nav ul.sf-menu li li li.sfhover ul {
           left: 30px;
    
        }
    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    This code works to a point

    Sorry, we need to see a working example of the webpage with the issue.

    Thread Starter phillsmile

    (@phillsmile)

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    I don’t see an issue in that webpage, does it occur in a particular browser or browser version?

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Help making wp dropdown horizontal menu’ is closed to new replies.