Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • July 7, 2017 at 11:24 am #817753
    Freek

    Hi,

    I browsed the Enfold support site for my problem but I cannot find a proper solution.
    I want to center align my menu as in attached screen prints.
    Screen1 is the current situation and screen 2 is what I want to achieve.

    see: Screenshots
    I managed to center the menu, add padding between menu items but when I resize (make smaller) my screen the menu does not look very nice.

    I used this custom css code:

    nav.main_menu {
  left: 40%;}

    Is there another way to get this right?
    THX Freek

    July 8, 2017 at 11:20 pm #818315
    Mike

    Hey Freek,
    for smaller screens would you like this:

    @media only screen and (min-width: 768px) and (max-width: 1023px) { nav.main_menu {
    left: 25%!important; 
}}

    Best regards,
    Mike

    July 9, 2017 at 9:48 am #818355
    Freek

    Mike,
    Not exactly.
    I want a menu as in screenshot2. Large padding between menu items and always centered on the screen.
    If the screen becomes smaller, the padding becomes smaller but the menu always must be centered.

    THX Freek

    July 9, 2017 at 3:15 pm #818387
    Mike

    Hi,
    OK, try this code for tablet, laptop, & desktop with a fix for the burger menu to keep it in line:

    @media only screen and (min-width: 768px) and (max-width: 1023px) { 
nav.main_menu {left: 25%!important;} 
.av-main-nav > li > a {padding: 0 20px!important; }
.sfm-pos-right .sfm-rollback {top: -87px;}}

@media only screen and (min-width: 1024px) and (max-width: 1439px) { 
nav.main_menu {left: 25%!important; }
.av-main-nav > li > a {padding: 0 30px!important; }
.sfm-pos-right .sfm-rollback {top: -125px;}}

@media only screen and (min-width: 1440px) and (max-width: 1800px) { 
nav.main_menu {left: 20%!important; }
.av-main-nav > li > a {padding: 0 60px!important; }
.sfm-pos-right .sfm-rollback {top: 35px;}}

    You can tweak the numbers a bit if you like, see screenshots in Private Content area.

    Best regards,
    Mike

    July 14, 2017 at 6:56 am #820966
    Freek

    It works ok until I update my theme to version 4.1.1
    Now I have a very strange thing. I see a classic menu, an Enfold burgermenu and my Superfly menu.
    How can I disable the burgermenu totally?
    THX Freek

    • This reply was modified 7 years, 5 months ago by Freek.
    July 14, 2017 at 7:14 am #820978
    Freek

    Sorry. Everything works fine now. During copying the css code something went wrong.
    THX Freek

    July 14, 2017 at 7:33 am #820992
    Vinay

    Hi,

    Glad we could help!
    Please take a moment to review our theme and show your support https://themeforest.net/downloads
    To know more about enfold features please check – http://kriesi.at/documentation/enfold/
    Thank you for using Enfold :)

    Best regards,
    Vinay

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • The topic ‘Menu center align’ is closed to new replies.