Support » Theme: Customizr » Center menu

  • 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?

    http://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.