• 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

Shifting Primary Navigation Bar to right

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 › Design Tips and Tricks › Shifting Primary Navigation Bar to right

This topic is: not resolved
  • This topic has 9 replies, 2 voices, and was last updated 13 years, 4 months ago by Mike Gosling.
Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • February 4, 2013 at 8:35 am #17840
    Mike Gosling
    Participant

    Where in the CSS for Focus Theme do I set the Primary navigation bar to right justify?


    Dr. Mike Gosling, The Emotional Leader Program

    February 4, 2013 at 9:10 am #17846
    SoZo
    Member

    Please include a link to your site with all questions so that people can see what is going on.


    John “Nicolas Flamel” Wright | SoZo’s design| John Wright Photography

    February 4, 2013 at 9:48 am #17871
    Mike Gosling
    Participant

    Ok, thanks and sorry. Site is: http://karengosling.com


    Dr. Mike Gosling, The Emotional Leader Program

    February 4, 2013 at 9:56 am #17875
    SoZo
    Member

    You'd need to break out the .menu-primary ul selector out of this group

    .menu-primary ul,
    .menu-secondary ul,
    #header .menu ul {
    	float: left;
    	width: 100%;
    }

    Into its own rule

    .menu-primary ul {
        width: auto;
        float: right;
    }

    John “Nicolas Flamel” Wright | SoZo’s design| John Wright Photography

    February 6, 2013 at 8:00 am #18426
    Mike Gosling
    Participant

    I have now set the CSS as follows:
    .menu-secondary ul,
    #header .menu ul {
    float: left;
    width: 100%;
    }
    .menu-primary ul {
    width: auto;
    float: right;
    }
    There is no change - The primary menu still aligns left and not right.
    Please advise further.


    Dr. Mike Gosling, The Emotional Leader Program

    February 6, 2013 at 8:06 am #18427
    SoZo
    Member

    Change it to this

    ul.menu-primary {
    width: auto;
    float: right;
    }


    John “Nicolas Flamel” Wright | SoZo’s design| John Wright Photography

    February 6, 2013 at 4:59 pm #18537
    Mike Gosling
    Participant

    Hi, I have changed the CSS to include ul.menu-primary {

    This has now removed the top navigation space and placed the primary navigation bar into the Header space, which has distorted the columns in my header and will likely mean the nav bar will disappear when I add an image in the header space.

    Please advise.


    Dr. Mike Gosling, The Emotional Leader Program

    February 6, 2013 at 5:07 pm #18539
    SoZo
    Member

    If you want the grey background to span the header you'd need to add it using #nav


    John “Nicolas Flamel” Wright | SoZo’s design| John Wright Photography

    February 6, 2013 at 5:52 pm #18547
    Mike Gosling
    Participant

    Thank you. That is helpful to know about the #nav.

    Are you able to advise me how to correct the header area after inserting: ul.menu-primary {

    Please view the header at http://www.KarenGosling.com


    Dr. Mike Gosling, The Emotional Leader Program

    February 7, 2013 at 11:28 pm #18867
    Mike Gosling
    Participant

    I'm advised that I need to create a css rule for #nav and add css for it in order to do what I need. That will correct the color above the header. (also add clear:both; to the css for #header). Unfortunately this is all jargon to me.
    If anyone reading this post is willing to complete this task for me for a fee paid by Paypal, please contact me with details at [email protected].
    Thanks.


    Dr. Mike Gosling, The Emotional Leader Program

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • The forum ‘Design Tips and Tricks’ 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

© 2026 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