• Could you please guide me. I want to align the menu links with the tagline to the right. It worked when I did it as an offline instal. but when I upload the very same style.css file onto the live server, it doesn’t show the way I’d like it to. going out of my mind trying to figure out where this one little thing can change

    I’ve used:

    UL#menu-main-nav.nav.tc-hover-menu{
    	float:right;
    }

    because I would still like the dropdown menu to be left aligned when you view it on a smaller viewport and after many hours of searching and trial and error, this seems to be the only way.

    Any ideas would be immensely appreciated.

Viewing 8 replies - 1 through 8 (of 8 total)
  • Thread Starter FRGD

    (@frgd)

    Sorry I didn’t understand, you want your menu under the tagline or you want the whole block (menu+tagline) on the right of the logo?

    Hey FRGD,

    Go to your blue.css file, and go to row 4449.
    Here you’ll see this:

    navbar .nav {
    position: relative;
    left: 0;
    display: block;
    float: left;
    margin: 0 10px 0 0;
    }

    Change the float: left; to float: right;

    After that go to row 8027.
    Here you’ll see this:

    .row-fluid .span9 {
    width: 74.358974359%;
    }

    You can either delete this or change the width to 100%
    So after you’ve change all of this it will look like this:

    Row 4449:

    navbar .nav {
    position: relative;
    left: 0;
    display: block;
    float: right;
    margin: 0 10px 0 0;
    }

    Row 8027

    .row-fluid .span9 {
    width: 100%;
    }

    Greetings,
    Adil

    I suggest to don’t change customizr css, and of course don’t change .row-fluid .span9, since it will affect all .row-fluid .span9.
    Anyway if what you want is just move the menu on the right, what MtpIntros says about float: right is “right”. But, again, don’t change the customizr css. But I think you already know it, since you’re using a child theme.
    Then all you have to do is, add this to your child theme style.css:

    navbar .nav {
        float: right;
    }

    Thread Starter FRGD

    (@frgd)

    Thanks. yes, originally I did use this. but then what it did was to right align all the menu items. I don’t want drop down items to be right aligned. I also don’t want the navigation for the responsive menu’s to be right aligned.

    I want the last menu item to line-up on the right handside with the tagline.(below the tagline, just where it is now.)

    Thanks

    This will align your menu to the right, the way you want, if I got id :D:

    .navbar.notresp .nav {
        float: right;
    }

    This will center your menu-button in mobile (was that a requested?..)

    navbar .btn-navbar {
       float: none;
       margin: auto;
    }

    Hi d4z_conf

    I try your css on my theme child, but it didn’t work, any suggestions?

    I’m using 3.2.8

    Thanks

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Navigation Menu right aligned’ is closed to new replies.