Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • March 6, 2015 at 8:29 pm #407257
    xlguy

    Hi,

    I’m on the latest version of Enfold. I have the nav menu below the logo. I would like it so my menu items are justified, i.e. equally spaced from the left to the right. See the screenshot: http://imgur.com/cf9E9bR

    I found this guide: http://jsfiddle.net/danield770/9hh86/

    But when I tried this, in my custom CSS, using #avia-menu it didn’t work.

    Any ideas how to achieve this in Enfold?

    • This topic was modified 9 years, 8 months ago by xlguy.
    March 6, 2015 at 9:31 pm #407284
    Elliott

    Hi xlguy!

    So your wanting the menu items to span the full width from left to right? I’m not sure if that is going to be possible. I suppose if you set the widths to a certain percentage and then change the letter spacing it might be feasible. Send us a link and we’ll take a look.

    Cheers!
    Elliott

    March 6, 2015 at 11:48 pm #407337
    xlguy

    Hi Elliot,

    Thanks for the reply. I’m actually developing it offline, so there’s no URL I’m afraid. However if you go to http://jsfiddle.net/danield770/9hh86/ you can see what I’m talking about (the style) and also the CSS that works on a standard page. The solution posted there is the one I find most often and specifically designed so you don’t have to specify widths for. My issue is that I’m struggling to adapt that code to work with Enfold.

    Thanks

    March 9, 2015 at 4:30 am #407840
    Ismael

    Hi!

    You can try this:

    ul#avia-menu {
    text-align: justify;
    min-width: 500px;
	width: 100%;
}

ul#avia-menu:after {
    content: '';
    display: inline-block;
    width: 100%;
}

ul#avia-menu li {
    display: inline-block;
	float: none;
}

    Regards,
    Ismael

    March 10, 2015 at 11:10 pm #409589
    xlguy

    Hi @Ismael that works great – thanks, I must have messed up my CSS the first time :)

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘Justify the main nav so it fills horizontal space?’ is closed to new replies.