Persistant Menu (But Not Title)

  • alecdb

    (@alecdb)


    8 years, 1 month ago

    [ Moderator note: moved to Fixing WordPress. Please do not use Developing With WordPress for these topics. ]

    Hello,

    I am working on a website which, on mobile, has a title area with the site name and a hamburger menu directly beneath it. I would like to make the menu stick to the top of the screen as the user scrolls down, but not the title area. Suggestions?

    Thank you,
    Alec Burns

    • This topic was modified 8 years, 1 month ago by alecdb.
    • This topic was modified 8 years, 1 month ago by Jan Dembowski.
Viewing 4 replies - 1 through 4 (of 4 total)
  • Pioneer Web Design

    (@swansonphotos)

    8 years, 1 month ago

    @alecdb,

    For help with display issues (CSS), it will be most beneficial if we can review the site, or specifically, the page(s) in question. Without a link, even the best forum volunteers would not even be able to even guess at a proper answer.

    Thread Starter alecdb

    (@alecdb)

    8 years, 1 month ago

    Sorry, the site is under heavy development but is currently hosted at http://alecbwd.com/testing/jay/.

    Pioneer Web Design

    (@swansonphotos)

    8 years, 1 month ago

    I would:

    1. Since the site title is repeated, just hide it with CSS. If needed on some pages, just add a new H1 tag in the content.

    
.title-area {
    display: none;
}

    I would then use (all that is needed is then):

    
.nav-primary {
    text-align: center;
}

    2. For the mobile menu, use this CSS:

    
@media only screen and (max-width: 800px) {
.menu-toggle {
    line-height: 20px;
    position: fixed;
    display: table;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    height: 5em;
    z-index: 1000;
    width: 100%;
}
}

    This CSS belongs in a Custom CSS Option (plugin, or custom CSS of theme). Direct edits to parent themes will be lost on theme update.

    Thread Starter alecdb

    (@alecdb)

    8 years ago

    Thanks. I tried that code, but now the menu doesn’t always stick to the top, as can be seen on the testing site. Any other ideas?

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Persistant Menu (But Not Title)’ is closed to new replies.