Custom Menu Help

  • Ok, so I have this menu going the way I would like but there are still 3 issues I need to see about getting fixed asap.

    1, I need the sub-menu to overlay the page and it’s contents rather than pushing the page and contents down.

    2, when the sub menu comes down I want to stop the border on the right from dropping down, or expanding with it.

    3, how do I get it to recognize the current page and style it to reflect it i.e. a different color?

    You can see the menu here. The only item that has a sub menu is the portfolio tab.

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

  • change this on your css\ position: relative to absolute

    #adam_menu li ul {
    display: block;
    left: 0;
    position: absolute;
    top: 18px;
    width: auto;}

    this should fix the problem

    Thread Starter 1-jah

    (@1-jah)

    Thanks, but that was incorrect. I already fixed the pushing of the content down by adding the position to absolute in the following code. 

    #adam_menu ul{
    list-style: none;
    margin: 10px 0 0 0;
    padding: 0;
    background: transparent none repeat scroll 0 0;
    color: #747474;
    position: absolute;
}

    I’m sure I’m about to fix the current page issue, but do you have any thoughts on stopping the right border from expanding?

    do you have any thoughts on stopping the right border from expanding?

    You could set the height of the menu item to a fixed amount:

    #adam_menu ul li {
    border-right: 1px solid #000000;
    padding: 5px 15px;
    position: relative;
    height: 40px;
}

    But then you should reduce how far down you push the submenu so there won’t be a gap between the menu item and the submenu:

    #adam_menu li ul {
    display: none;
    position: relative;
    top: 2px;
    left: 0;
    width: auto;
}

    Thread Starter 1-jah

    (@1-jah)

    Perfect CrouchingBruin! Thanks. Though I’m also having issues with the fact that when the sub-menu drops down it seem to push the border right further right. Any suggestions?

    CrouchingBruin

    (@crouchingbruin)

    Try changing the rule like this:

    #adam_menu li ul {
    display: none;
    position: absolute;
    top: 35px;
    left: 0;
    right: 0;
    width: 140px;
}

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Custom Menu Help’ is closed to new replies.

Tags