• Resolved GarryB

    (@garryb)


    I have placed the code below in the custom css of the Customizr theme and I can’t seem to get the menu to center. Where am I going wrong?

    https://dev.jellystonebranson.com/

    Thanks in advance.

    /* Center the logo (function custom_center_brand)       */
    .brand.span10.offset1 {
    float:      none;
    }
    /* Center the Tagline                                   */
    .tc-header .outside {
    display:    block;
    text-align: center;
    }
    
    /* Center the Menu (function remove_span9_navbar_display) */
    /* Center the Menu (function prevent_social_in_header)  */
    .navbar-inner .row-fluid .span7.site-description {
    display:    none;
    text-align: center;
    }
    .navbar-wrapper .navbar.notresp.row-fluid {
    float:      none;
    width:      90%;
    margin:     0 auto;
    }
    .navbar .navbar-inner {
    padding:    20px 0 0;
    }
    
    /* Variable number of floating elements */
    .navbar .nav {
    float:      none;
    width:      100%;
    text-align: center;
    }
    .navbar .nav > li {
    float:      none;
    display:    inline-block;
    }
    
    /* Fix 2nd levels */
    .navbar .nav > li .dropdown-menu li {
    float: left;
    width: 100%;
    text-align: left;
    }
    
    @media (max-width: 979px) {
    .tc-header .brand { width: auto; }
    .row-fluid .offset1:first-child { margin-left: 0; }
    }
Viewing 3 replies - 1 through 3 (of 3 total)
  • SideKick Dan

    (@shout-out-sidekick)

    Try these things ?? After the bigger issue is fixed you should be able to toy more reliabley with the exaxt needs you have ??

    Find the line in your html template to manually edit this

    <div class="navbar-wrapper clearfix span9">

    and change it to this

    <div class="navbar-wrapper clearfix container">

    And in this

    .navbar-wrapper .navbar.notresp.row-fluid {
    float: none;
    width: 90%;
    margin: 0 auto;
    }

    Delete the width completly that says 90%

    In this

    .navbar .nav {
    float: none;
    width: 100%;
    text-align: center;
    }

    Get rid of text-align:center

    Add this

    .social-block {
    display: none !important;
    }
    .navbar .nav {
    float: left !important;
    }

    Danny :

    SideKick Dan

    (@shout-out-sidekick)

    btw, yogi bear was my favorite ?? lol

    Thread Starter GarryB

    (@garryb)

    Resolved….used functions code

    // center the logo by switching TBs classes on brand div:
    add_filter('tc_logo_title_display', 'custom_center_brand');
    function custom_center_brand($output) {
    return preg_replace('/brand span3/', 'brand span10 offset1', $output);
    }
    
    // prevent the output of tc_social_in_header:
    add_filter('tc_social_in_header', 'prevent_social_in_header');
    function prevent_social_in_header($output) {
    return;
    }
    
    // remove span9 from navbar-wrapper:
    add_filter('tc_navbar_display', 'remove_span9_navbar_display');
    function remove_span9_navbar_display($output) {
    return preg_replace('/navbar-wrapper clearfix span9/', 'navbar-wrapper clearfix', $output);
    }
Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Center menu’ is closed to new replies.