Viewing 20 posts - 1 through 20 (of 20 total)
  • Author
    Posts
  • July 6, 2018 at 11:34 am #981987
    jairharder

    Hello Enfold,

    I would like te create a header like in the link.
    – menu text divided over the content width;
    – textline closer to logo;

    How can I do this?

    Thank you in advance.

    Jaïr

    July 6, 2018 at 7:49 pm #982216
    Victoria

    Hey jairharder,

    You can increase menu link paddings and add the tagline below the logo. The logo has to be set to “logo center, menu below”.

    If you need further assistance please let us know.
    Best regards,
    Victoria

    July 8, 2018 at 10:50 am #982667
    jairharder

    Hello Victoria,

    Very nice to know that it is possible. The thing is that I don’t know how. I set the logo to logo centre and menu below already. Could you please tell me how I can realize the setup as shown in my design?

    Greetz Jaïr

    July 8, 2018 at 7:50 pm #982793
    Victoria

    Hi jairharder,

    Could you please give us a link to your website, we need more context to be able to help you.

    Best regards,
    Victoria

    July 12, 2018 at 9:43 am #984574
    jairharder

    The website is not running yet…its in maintenance mode. Below the link with a printscreen of the Enfold website and a printscreen of the design…I hope this will do it.

    Looking forward hearing from you.

    Greetz Jaïr

    July 12, 2018 at 1:08 pm #984700
    Victoria

    Hi Jaïr,

    We need to see the actual css and html to be able to propose a solution for you. Please get back to us when you get the website to some testing server.

    Best regards,
    Victoria

    July 12, 2018 at 3:20 pm #984797
    jairharder

    Please explain what you want… you are not helping me on this way!

    Why is this guestion so difficult to answer? With other guestions I get some code of the moderator and add this in the CSS content…

    July 13, 2018 at 6:54 am #984973
    Rikard

    Hi,

    We need to see the actual website in order to give you accurate CSS. If the site is in maintenance mode then provide admin login details in private.

    Best regards,
    Rikard

    July 13, 2018 at 12:17 pm #985124
    jairharder

    Ok, I taken it out of the maintenance mode…
    The link is:

    Home

    July 16, 2018 at 5:50 am #985833
    Ismael

    Hi,

    Thanks for the update.

    Use this css code to create some space between the menu items.

    #top #avia-menu {
    display: flex;
    justify-content: space-evenly;
    width: 100%;
}

    Best regards,
    Ismael

    July 16, 2018 at 9:04 pm #986097
    jairharder

    Hi Ismael,

    Thank you for your response. Unfortunately, the code isn’t working. I put the code in the website styling quick CSS area but nothing happens. What do I do wrong?

    Looking forward to your positive response.

    Greetz Jaïr

    July 17, 2018 at 4:19 am #986219
    Ismael

    Hi,

    Did you enable the css/js compression in the Enfold > Performance panel? Please disable those options temporarily and then purge the browser cache before checking the page.

    Best regards,
    Ismael

    July 17, 2018 at 10:46 pm #986686
    jairharder

    Hello Again,

    Yesss, the code is working. Thank you. Following guestion:
    – how can I play with the spaces between the words and the spaces at both sides of the menu. Also I would like to reduce the top margin of the menu towards the logo. I would like to have the logo sinked into the menu, like, in the middle the logo (logo little bit above the menu line) and on both sides parts of the menu

    Is this possible?

    Greetings Jaïr

    July 18, 2018 at 3:27 am #986731
    Ismael

    Hi,

    The “justify-content” property will automatically apply spaces evenly distributed between the items so you can’t adjust it manually.

    More about flexbox: https://css-tricks.com/snippets/css/a-guide-to-flexbox/

    You can use this css code to adjust the space on both sides of the menu.

    #header #header_main_alternate .container {
    padding: 0 100px;
}

    Default side padding value is 50px.

    Best regards,
    Ismael

    July 18, 2018 at 8:27 am #986833
    jairharder

    Hey Ismael,

    The padding only workes for creating more distance between the menu and the logo. Maybe the padding code of the logo is doing this?

    Grtz Jair

    July 19, 2018 at 12:07 pm #987349
    Ismael

    Hi,

    Did you adjust the second value of the padding property? First value (0) is the top and bottom paddings and the second value (100px) is the right and left paddings. You should adjust the second value and leave the first value as it is.

    Best regards,
    Ismael

    July 19, 2018 at 12:57 pm #987366
    jairharder

    Hi,

    Mmmhh, the first value only gives a verticaly change but only downwards.

    July 19, 2018 at 1:03 pm #987373
    Ismael

    Hi,

    You should change the second value.

    #header #header_main_alternate .container {
    padding: 0 100px;
}

    First value is zero, second is 100px. Adjust the second value.

    Best regards,
    Ismael

    July 19, 2018 at 1:13 pm #987378
    jairharder

    I understand what you are saying. I tried that one but it gives only a horizontal adjustment. I would like the menu closer towards the logo…

    July 20, 2018 at 1:08 pm #987795
    Ismael

    Hi,

    I see. Use this css code for that.

    .av_minimal_header #header_main_alternate {
    border: none;
    margin-top: -10px;
}

    Best regards,
    Ismael

  • Author
    Posts
Viewing 20 posts - 1 through 20 (of 20 total)
  • You must be logged in to reply to this topic.