[Resolved] Navigation bar without padding

[Jurjen Brouwer]

Last week David helped me te remove the padding on the right site of the navigation bar.
But what would be the CSS to remove padding on the left side?
Please help….
Jurjen

[Leo]

Hi there,

Any chance you can link us to the site in question?

You can use the private information field.

Let me know 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Jurjen Brouwer]

http://www.5plogistics.com

[Elvin]

Hi,

I’ve checked your navbar and it doesn’t seem to have any padding but rather, a margin-left:auto; that adds space to make the nav menu items appear centered so it looks visually balanced.

To clarify: Do you want to remove this margin-left:auto; instead?

Removing it will result to this: https://share.getcloudapp.com/DOuoW2l2

If this is the desired effect, you can add this CSS:

nav.main-navigation .inside-navigation {
    margin-left: unset;
}

A wise man once said:
"Have you cleared your cache?"

[Jurjen Brouwer]

No, that’s not the effect we wanted….
We would like to have “Home” a bit more to the left , so it is in the same line as the logo and the W from Warehousing.
Is that possible?

The solution for the right side David send worked. Now looking for the solution on the left side

@media(min-width: 1100px) {
.main-navigation .main-nav ul li:last-child a {
padding-right: 0;
}
}

[David]

Hi there,

change your current CSS to this:

@media(min-width: 1100px) {
    .main-navigation .main-nav > ul > li:first-child a {
        padding-left: 0;
    }

    .main-navigation .main-nav > ul > li:last-child a {
        padding-right: 0;
    }

}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Jurjen Brouwer]

Thanks again, David
Happy !!!!!!!

[David]

Glad to be of help

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Jurjen Brouwer]

The nav.bar is just how we wanted it to be , but :
the first item in de sub menu seems to be affected too. 🙁
Please help (again)
Jurjen

[David]

I edited the code here:
https://generatepress.com/forums/topic/navigation-bar-without-padding-2/#post-1543752

Let us know

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Jurjen Brouwer]

Didn’t work, the first item in the dropdown menu was out of line (completely left)
I removed the CSS….

[David]

Another edit made here:

https://generatepress.com/forums/topic/navigation-bar-without-padding-2/#post-1543752

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Jurjen Brouwer]

That seems to do the trick….. Thanks…

[David]

Glad to be of help

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts