• Skip to main content
  • Skip to forum navigation

StudioPress

  • Shop for Themes
  • My StudioPress

Forum navigation

  • Home
  • General Genesis Discussions
  • StudioPress Themes
  • Genesis Blocks
    • Genesis Blocks
    • Genesis Custom Blocks
  • Retired Themes
  • FAQs
  • Forum Rules
  • Internationalization and Translations
  • Forum Bugs and Suggestions
  • Forum Log In

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

Corporate Theme – Drop Down Menu doesn't display correctly

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Log In
Register Lost Password

Community Forums › Forums › Archived Forums › General Discussion › Corporate Theme – Drop Down Menu doesn't display correctly

This topic is: resolved

Tagged: corporate, drop down menu

  • This topic has 1 reply, 1 voice, and was last updated 10 years, 9 months ago by danielleB.
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • September 19, 2014 at 5:02 pm #125104
    danielleB
    Participant

    The corporate theme is my favorite thus far and I was having a grand time designing a pretty cool site with it (went to bed with a smile yesterday!) and then spent all day trying to solve a problem with the drop-down menu with zero success and I can't take it anymore! Any help will be greatly appreciated. Here's what I did that screwed things up:

    1) First, I wanted my header and primary navigation full-width, so I changed the CSS to reflect this: 1400 px
    2) To align the primary navigation 'list' to the width of the rest of the page, I tweaked the CSS by adding a margin to:

    #nav ul {
    float: left;
    margin: 0 0 0 160px; (this moved the menu to the right, which line it up perfectly with the content area)
    width: 100%;

    3) So far, I was pleased. But when I added child pages to the parents, I noticed that the drop-down menu didn't line up under the 'parent' menu item, so I tweaked the CSS again to move the drop-down menu directly beneath it's parent by adding to:

    #nav li li {
    margin: 0 0 0 -160px;

    It worked, except that the block shrunk so that only two of the 4 sub-menu items now show up. It's as though the other items are hidden behind what's left of the drop-down block.

    I wish I could provide a link, but I'm designing locally.

    Can anyone help?


    Danielle

    September 20, 2014 at 8:32 am #125136
    danielleB
    Participant

    UPDATE...

    I suspect it's the actual size of the drop-down box that prevents the sub-menu from displaying correctly.

    Where in the CSS would I find the correct place to resize the drop-down menu box? Here is the current code for primary navigation:

    /* Primary Navigation
    ------------------------------------------------------------ */

    #nav {
    background: url(images/nav.png);
    border-top: 1px solid #fff;
    clear: both;
    color: #fff;
    font-family: 'Droid Sans', arial, serif;
    font-size: 12px;
    margin: 0 auto;
    overflow: hidden;
    width: 1400px;
    }

    #nav ul {
    float: left;
    margin: 0 0 0 160px;
    width: 100%;
    }

    #nav li {
    border-right: 1px solid #333;
    float: left;
    list-style-type: none;
    }

    #nav li li {
    border: none;
    /*border-top: 1px solid #fff;*/
    margin: auto -160px;
    }

    #nav li a {
    border-right: 1px solid #000;
    color: #fff;
    display: block;
    padding: 11px 20px 10px;
    position: relative;
    text-decoration: none;
    text-transform: uppercase;
    }

    #nav li a:hover,
    #nav li a:active,
    #nav .current_page_item a,
    #nav .current-cat a,
    #nav .current-menu-item a {
    background: url(images/nav-hover.png);
    color: #fff;
    }

    #nav li a .sf-sub-indicator {
    display: block;
    overflow: hidden;
    position: absolute;
    text-indent: -9999px;
    }

    #nav li li a,
    #nav li li a:link,
    #nav li li a:visited {
    background: none;
    background-color: #333;
    border: 1px solid #111;
    border-top-width: 0;
    color: #fff;
    font-size: 12px;
    padding: 6px 10px 5px;
    position: relative;
    text-transform: none;
    width: 138px;
    }

    #nav li li a:hover,
    #nav li li a:active {
    background: none;
    background-color: #111;
    color: #fff;
    }

    #nav li ul {
    height: auto;
    left: -9999px;
    position: absolute;
    width: 160px;
    z-index: 9999;
    }

    #nav li ul a {
    width: 140px;
    }

    #nav li ul ul {
    margin: -32px 0 0 159px;
    }

    #nav li:hover>ul,
    #nav li.sfHover ul {
    left: auto;
    }

    /* Primary Navigation Extras
    ------------------------------------------------------------ */

    #nav li.right {
    float: right;
    padding: 10px 10px 8px;
    }

    #nav li.right a {
    background: none;
    border: none;
    display: inline;
    text-decoration: none;
    }

    #nav li.right a:hover {
    color: #444;
    text-decoration: none;
    }

    #nav li.search {
    padding: 0 10px;
    }

    #nav li.rss a {
    background: url(images/rss.png) no-repeat center left;
    margin: 0 0 0 10px;
    padding: 0 0 0 16px;
    }

    #nav li.twitter a {
    background: url(images/twitter-nav.png) no-repeat center left;
    padding: 0 0 0 20px;
    }


    Danielle

  • Author
    Posts
Viewing 2 posts - 1 through 2 (of 2 total)
  • The forum ‘General Discussion’ is closed to new topics and replies.

CTA

Ready to get started? Create a site or shop for themes.

Create a site with WP EngineShop for Themes

Footer

StudioPress

© 2025 WPEngine, Inc.

Products
  • Create a Site with WP Engine
  • Shop for Themes
  • Theme Features
  • Get Started
  • Showcase
Company
  • Brand Assets
  • Terms of Service
  • Accptable Usse Policy
  • Privacy Policy
  • Refund Policy
  • Contact Us
Community
  • Find Developers
  • Forums
  • Facebook Group
  • #GenesisWP
  • Showcase
Resources
  • StudioPress Blog
  • Help & Documentation
  • FAQs
  • Code Snippets
  • Affiliates
Connect
  • StudioPress Live
  • StudioPress FM
  • Facebook
  • Twitter
  • Dribbble