Menu right center on high with logo

Support
#1

Hi together,

I have an issue with my menu. I have the logo on the left side and the menu on the right. Now my issue:
I want to have the menu and the logo on one line (menu point should be on the line with the “unity”) Second I want to ahve my bar close to the slider.

Website: www.asapunity.com

Thank you for your help.

#2

Hello @patsorules,

Thanks for asking. :slight_smile:

You can add following CSS under X > Theme Options > CSS:

.x-nav-wrap.desktop {
    margin-top: 20px;
}

.x-container.offset {
    margin-top: 0 !important;
}

I have found the proper CSS code selector using the Chrome browser Developer Toolbar:

For the CSS code itself, I suggest that you get started with this tutorial:

Thanks.

#3

Thanks I will have a look to the videos. Thanks.

But actually the problem is not solved at all. The Menu is now good, but the logo is not longer in the left corner. Its more in the middle now. Is it possible to have the logo on the left side.

UPDATE: I tried it with the video things and solved it with the code .x-container.max {
margin-left: 50px;
}

But the menu is now in the middle and not on the right side???

Best regards

#4

Hi,

Kindly do the following

  1. Remove all css you have added
.x-nav-wrap.desktop {
    margin-top: 20px;
}

.x-container.offset {
    margin-top: 0 !important;
}

.x-container.max {
     margin-left: 50px;
}
  1. Remove slider element in your first section and utilize Slider Below Masthead

  1. You can then adjust the alignment of your navbar under Theme Options > Header > Links alignment

Hope this helps

#5

Hi there,

sorry but it doesn’t work right. The problem is, that the menu is align left and not right, i think?!

best regards,

#6

Hi There,

The culprit of that is the custom CSS that you added. Please remove that.

.x-container.max {
     margin-left: 50px;
}

That will actually cause a lot of issue on your site (take a look on the footer, it is slightly off center)

Please follow Paul’s instruction above.

Then add this to Theme Options > CSS, if you want the logo and menu to stay on their respective side on all screen sizes.

.x-navbar-wrap .x-container.max {
    max-width: none;
}

Hope it helps,
Cheers!

#7

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