Move nav bar logo left

Support
#1

Hi,
Do you the know easiest way I can move my nav bar logo more to the left and my menu link down?

Thanks in advance

#2

Hello @quituck,

Thanks for writing in!

Please try using following CSS under X > Theme Options > CSS and let us know if that’s the output you are looking for:

@media only screen and (max-width: 600px) {
 .x-navbar-inner {
    display: inline-box;
    width: 80%;
}
}

1- I have found the proper CSS code selector using the Chrome browser Developer Toolbar: https://www.youtube.com/watch?v=wcFnnxfA70g

2- For the CSS code itself, I suggest that you get started with this tutorial: https://www.youtube.com/watch?v=yfoY53QXEnI

Thanks.

#3

Hi,
I tried using the code above but that did not work.

I’m currently using the following code:
.x-brand {
display: block;
float: left;
line-height: 1;
text-decoration: none;
}
My logo is floating left but I want make it more to the left corner. How can I do that?

As for the nav bar link alignment, I don’t see an option for it in my custom settings. I want to add more padding to the top. How can I easily do that?

Please advise?

Thanks again

#4

Hi @quituck,

The logo is already on the left edge of the container if you want the logo to go more to the left, we need to increase the width of that container.

.x-navbar-inner .x-container.max.width {
	max-width: none;
    width: 98%;
}

Please navigate to X > Theme Options > Header and look for Navbar Top Link Alignment



Hope it helps,
Cheers!

#5

Hi,
So I was able to move the logo more left. Now, my nav links are positioned to the edge of the right. How can I center the links keeping the logo where it is?

Also I was able to adjust the height of my nav bar links using the following code

.x-navbar .desktop .x-nav > li > a {
height: 90px;
padding-top: 60px;
padding-bottom: 50px;

}

Thanks for you help!

#6

Hi @quituck,

Please try this code:

.x-navbar-inner {
    text-align: center;
}

.x-nav-wrap.desktop {
    display: inline-block;
}

Hope this helps.

#7

Perfect! Thank you so much!

#8

You’re always welcome @quituck!

Cheers.

#9

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