Full width Nav bar in Pro

Hello world,

I have a problem which i am sure is easily resolved but haven’t found the solution as of yet.

I am creating a Nav Bar in X Theme Pro.

I have created a second bar and added a menu to fit in under the first nav bar.

I would like the text(menu items) to be full width across the bar, and the roll over to equally fill the space, not just a small space around the writing/link.

Please see image attached, note - the roll over on “CONVERSIONS” is the example of the roll over not equally filling the space, just the writing/link.

I hope this makes sense.

Thank you,

Hey @kumararran,

Please check the bar and the container settings and set the Content Length to 100%, Content Max Length to none, and the Max Width to none.

Hope this helps.

Hi Jade,

Thank you for your reply.

Unfortunately- this hasnt resolved my issue. The roll over is still not covering end to end.

I believe it has something to do with the particles and padding section?

Please see my screen shot:

Hello @kumararran,

Aside from the suggested settings by @Jade, please make sure that the container and the navigation inline element “Self Flex” setting is set to “Fill Space Equally”.

Please let us know if this works out for you.

Sorry this does not work either - is it possible to logon and help?

Hi @kumararran,

Sure! Please provide us with the admin access to your site in a Secure Note:

thank you i have sent over the details

Hey Saswata,

Please add this code to the Element CSS of the Inline Navigation element:

$el .menu-item {
  width: 20%;

$el .menu-item .x-anchor-menu-item {
  width: 100%;

Hope this helps.

Hi - please update me with the status when possible.

Massive thanks!

Hey @kumararran,

You can always check our changelog from time to time.


This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.