Viewing 19 posts - 1 through 19 (of 19 total)
  • Author
    Posts
  • October 10, 2013 at 8:00 am #173473
    davidrk

    I’m hoping you can assist with a few navigation issues. You can view the development page here.

    1) How do I align the menu items in the side navigation to the left, and remove everything other than the menu items?
    2) How do I reduce the width of the side navigation and the size of the text?
    3) With the side navigation, is there a way that all ‘child’ items can be hidden except those relevant to the section?

    Thank you

    • This topic was modified 11 years, 2 months ago by davidrk. Reason: Top Menu items resolved
    October 11, 2013 at 1:34 am #173884
    Yigit

    Hello davidrk!

    Please add following code to Quick CSS in Enfold theme options under Styling tab

    #top .widget_nav_menu li { float: left; font-size: 11px; }
#top .sidebar_left .widget_nav_menu .sub-menu { display: none; }

    Regards,
    Yigit

    October 11, 2013 at 5:18 am #173976
    davidrk

    Thanks for that! Works great! Still wondering though if there is a way to reduce the width of the left sidebar to 2 units. As you can see here there is a lot of blank space to the right.

    Also would like to remove the bullet that seems to be appearing the right of the child elements.

    Thanks for your help!

    October 11, 2013 at 4:57 pm #174267
    Dude

    Hey!

    Still wondering though if there is a way to reduce the width of the left sidebar to 2 units

    Yes – see https://kriesi.at/support/topic/changing-the-sidebar-width-and-keeping-it-responsive/

    Regards,
    Peter

    October 12, 2013 at 6:35 am #174480
    davidrk

    Thanks that’s great. Sorry but would still like to know if there is a way to remove the bullets that are appearing to the right the of the side nav menu items. You can view the page here to see what I mean.

    Also, is it possible to reduce the padding to the right of the side navigation so the menu items stay on one line.

    They also to align right when on 2 lines which I would prefer to avoid.

    Thanks!

    October 14, 2013 at 5:58 am #174957
    Ismael

    Hey!

    Add this on your custom.css or Quick CSS:

    1.) Remove bullets:

    #top .widget_nav_menu ul ul li:before {
content: "";
}

    2.) Menu alignment:

    #top .widget_nav_menu ul ul li a {
padding: 6px 0px 7px 0px;
}

.widget_nav_menu ul:first-child>.current-menu-item>a, .widget_nav_menu ul:first-child>.current_page_item>a {
border: none;
padding: 6px 12px 7px 0;
}

    Best regards,
    Ismael

    October 17, 2013 at 2:07 am #176797
    davidrk

    Thanks for that.

    Unfortunately the menu child elements are still aligning to the right. Please click here to view what I mean.

    Also, is there any way to reduce the padding to the right of the side navigation so the menu items appear on one line. There appears to be a fair bit of unnecessary padding.

    Thank you

    October 17, 2013 at 6:09 am #176857
    Josue

    Hey!

    Try with this code:

    .nested_nav li {
text-align: left !important;
}

    Best regards,
    Josue

    October 18, 2013 at 12:13 am #177224
    davidrk

    Great works perfectly!
    I would still like to know if there is a way to minimise the padding to the right of the side navigation so I can get the menu items onto the one line. There appears to be 52px of padding to the right that I would like to take down to about 20px. Any ideas on this would be appreciated.

    Also, is there a way to make the sub menu items of the active section in the side menu bold so they appear different to the links to the other sections?

    Thank you!

    October 18, 2013 at 2:29 pm #177392
    Ismael

    Hi!

    Please try to move the left sidebar using this:

    .sidebar_left.sidebar {
text-align: right;
right: -20px;
z-index: 2;
}

.responsive .container .ten.units {
z-index: 5;
background: white;
}

    Regards,
    Ismael

    October 20, 2013 at 2:29 am #177977
    davidrk

    Unfortunately that didn’t work, just shifted the entire side nav bar widget to the right. There is 52px of padding applied to the classes `.sidebar_left .widget_nav_menu ul:first-child > .current_page_item
    however when I change that it just shifts the container to the left.
    What I’d really like is to be able to have the menu items appearing on one line, and find a way to reduce the amount of space to the right of the sidebar menu as can be viewed on pages linked to above. There seems to be a lot of wasted space on the right hand side of the side nav bar.
    Been trying different fixes on this for hours. Any ideas appreciated.

    Thanks

    October 21, 2013 at 2:58 am #178219
    Ismael

    Hi!

    Please post a screenshot of what you’re trying to do. The code above shifted the sidebar to the right essentially removing some space.

    Best regards,
    Ismael

    October 21, 2013 at 3:30 am #178234
    davidrk

    Hi there,
    The image ‘btb2.jpg’ illustrates what I want to do.
    Screenshot 1

    The attached image ‘btb3.jpg’ illustrates the effect of the above code.
    Screenshot 2

    Apologies for any confusion with this issue.
    Thank you!

    October 21, 2013 at 7:56 am #178299
    Ismael

    Hi!

    Please add this on your custom.css or Quick CSS:

    #top .widget_nav_menu li {
min-width: 300px;
}

    Best regards,
    Ismael

    November 4, 2013 at 2:14 am #184066
    davidrk

    Almost a success! Works as I want, except when the screen is reduced to tablet size. Unfortunately the side menu items become hidden beneath the main section instead of hard returning. Any ideas?
    BTB side menu

    November 4, 2013 at 2:17 am #184067
    Yigit

    Hey!

    Please add following code to Quick CSS as well

    #top .widget_nav_menu li {
min-width: 90px;
}

    Regards,
    Yigit

    November 4, 2013 at 2:24 am #184073
    davidrk

    Quick response, unfortunately no joy. That makes the majority of side menu items hard return, and to me overrides the original CSS fix:
    `#top .widget_nav_menu li {
    min-width: 300px;
    }

    November 4, 2013 at 5:27 pm #184344
    Josue

    Hey!

    Try with this:

    #top .widget_nav_menu li {
min-width: 140% !important;
}

    Cheers!
    Josue

    November 4, 2013 at 11:48 pm #184545
    davidrk

    Yes! Thank you so much! Been struggling with this one for quite some time. Thanks again for your help, much appreciated.
    Cheers

  • Author
    Posts
Viewing 19 posts - 1 through 19 (of 19 total)
  • The topic ‘Top Menu & Side Navigation Issues’ is closed to new replies.