Skip to:
Content
Pages
Categories
Search
Top
Bottom

Move bp default theme menu to the left

  • Avatar of bojan85
    bojan85
    Participant

    @bojan85

    I have been trying to move the menu on the bp default theme to left but can’t get it to work for some reason. I have tried this two codes that i found in the forums so far on my child theme css.

    #navigation {
    text-align:left;
    }

    #navigation {
    text-align: left;
    }
    #nav {
    left: auto;
    margin: 40px 0 0 20px;
    }

    Any ideas?

Viewing 5 replies - 1 through 5 (of 5 total)
  • Avatar of @mercime
    @mercime
    Keymaster

    @mercime

    You only need to add this to your style.css file:
    `#navigation #nav {
    float: left;
    margin: 40px 0 0 20px;
    }`

    Avatar of bojan85
    bojan85
    Participant

    @bojan85

    Hi @mercime, I tried that code but for some reason its not moving.

    Below is my child css can you give me a hint if I have made a mistake somewhere?
    Thank you for your time.

    /*
    Template: bp-default
    Tags: buddypress, two-column,
    */
    #navigation #nav {
    float: left;
    margin: 40px 0 0 20px;
    }

    body {
    font-size: 14px;
    }
    #header {
    background: #FFF;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    color: #333;
    height: auto;
    margin-bottom: 0;
    line-height: 1.2em;
    filter: none;
    padding: 0;
    }
    #header #search-bar {
    min-height: 75px;
    margin-top: 0;
    }
    div.item-list-tabs {
    margin-bottom: 10px;
    background: #EAEAEA;
    background: -moz-linear-gradient(top, #EAEAEA 0%, #EAEAEA 15%, #D2D3D4 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#EAEAEA), color-stop(15%,#EAEAEA), color-stop(100%,#D2D3D4));
    background: -webkit-linear-gradient(top, #EAEAEA 0%,#EAEAEA 15%,#D2D3D4 100%);
    background: -o-linear-gradient(top, #EAEAEA 0%,#EAEAEA 15%,#D2D3D4 100%);
    background: -ms-linear-gradient(top, #EAEAEA 0%,#EAEAEA 15%,#D2D3D4 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=’#EAEAEA’, endColorstr=’#D2D3D4′,GradientType=0 );
    background: linear-gradient(top, #EAEAEA 0%,#EAEAEA 15%,#D2D3D4 100%);
    }
    div#subnav.item-list-tabs {
    filter: none;
    }
    #header #search-bar .padder {
    padding: 10px 15px;
    min-height: 5em;
    height: auto;
    }
    #search-form {
    margin-top: 14px;
    }
    #header #search-bar input[type=text] {
    border: none;
    -moz-border-radius: 1em;
    -webkit-border-radius: 1em;
    border-radius: 1em;
    margin-right: 4px;
    padding: 5px;
    font-size: 1em;
    line-height: 1em;
    }
    #header #search-bar input[type=text]:focus {
    outline: 0;
    -moz-box-shadow: 0 0 10px #FFF;
    -webkit-box-shadow: 0 0 10px #FFF;
    box-shadow: 0 0 10px #FFF;
    }
    #header #search-bar input[type=submit] {
    font-size: 13px;
    padding: 1px 6px;
    margin-left: 4px;
    border-style: solid;
    border-width: 1px;
    color: #FFF;
    text-shadow: 0 1px 0 #000;
    }
    #header h1 {
    float: left;
    margin-bottom: 0;
    margin-top: -5px;
    text-align: left;
    max-width: 520px;
    }
    #header h1 a {
    color: #FFF;
    text-decoration: none;
    text-transform: lowercase;
    font-size: .7em;
    font-weight: 400;
    text-shadow: 0 -1px 0 #052343;
    line-height: 1em;
    letter-spacing: 0;
    text-align: left;
    max-width: 520px;
    }

    Avatar of @mercime
    @mercime
    Keymaster

    @mercime

    Your stylesheet looks fine. Might need to add !important
    `#navigation #nav {
    float: left;
    margin: 40px 0 0 20px !important;
    }`
    If that doesn’t work, there might be something else interfering, so need your Site urle

    Avatar of raminjan
    raminjan
    Participant

    @raminjan

    well @mercime thanks for your feedback but I have tried the same thing and it’s not working but let me ask you this does the fact that I am using bp-columns child theme and that theme has a left sidebar, might be the reason that is interfering with this. by the way my site url is http://www.buddyswired.com

    and when you get there you will see that there’s nothing in left sidebar except the avatar and your name but I would like to move everything “bp-Menu” into that sidebar. Now I know there’s the plugin from modemlooper but his plugin doesn’t have a menu tree so if I use his plugin and remove completely the center column menu, then all sub-links would be gone.

    Avatar of drill_sgt.lewis
    drill_sgt.lewis
    Participant

    @drill_sgtlewis

    Add important! just like mercime said it over rides any inherited styles when you add !important:
    Example:
    #navigation #nav {
    float: left !important;
    margin: 40px 0 0 20px;
    }
    If this is not working then use firefox’s firebug extension to make sure the element is correctly targeted.

Viewing 5 replies - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.