Remove padding from navigation

20 minutes ago, matthewhodges said:

Site URL: https://www.crxssplatfxrm.com

The navigation on my site runs onto two lines, even when it appears there is plenty of space for it to stay on one line.

I guess there is some kind of padding at the sides – how can I remove this?

I would prefer that the navination never went to two lines, and if the screen wifth isn't wide enough it would go straight to the burger menu. Is that possible?

Can be, please paste this into Settings->Custom Css

.header-layout-branding-center-nav-center .header-title-nav-wrapper {
  width: 100%;
  display: block;
  flex: 100%;
}

That worked perfectly, thank you!

Hi @bangank36 ! I just tried this code on my site and it keeps the nav from breaking, which is great, but it also caused the nav to be way off-center. Do you know why this would be? 

I removed the code for now but the site is https://www.pamelaackerman.com/

Thanks!

On 10/22/2020 at 12:28 AM, xallarap said:

Hi @bangank36 ! I just tried this code on my site and it keeps the nav from breaking, which is great, but it also caused the nav to be way off-center. Do you know why this would be? 

I removed the code for now but the site is https://www.pamelaackerman.com/

Thanks!

Try this

.header-layout-branding-center-nav-center .header-nav {
	width: 1500px;
}

Hi @bangank36 Is there a way to modify this code so it works with a shopping cart icon in the header section? The second code you provided for pamelaakerman.com worked but it pushes the shopping cart off the screen: trueselfcouture.com. I left code on the site for now so you can see. The shopping cart is enabled and shows when I delete the css code. I've tried resizing the margins and page widths.

Any help is much appreciated! Thanks so much!

Avery 

On 10/25/2020 at 4:27 AM, TrueSelfCouture said:

Hi @bangank36 Is there a way to modify this code so it works with a shopping cart icon in the header section? The second code you provided for pamelaakerman.com worked but it pushes the shopping cart off the screen: trueselfcouture.com. I left code on the site for now so you can see. The shopping cart is enabled and shows when I delete the css code. I've tried resizing the margins and page widths.

Any help is much appreciated! Thanks so much!

Avery 

Kindly check this

.header-layout-branding-center-nav-center .header-nav {
    width: 100vw;
    position: absolute;
    bottom: -50px;
}

On 10/22/2020 at 12:28 AM, xallarap said:

Hi @bangank36 ! I just tried this code on my site and it keeps the nav from breaking, which is great, but it also caused the nav to be way off-center. Do you know why this would be? 

I removed the code for now but the site is https://www.pamelaackerman.com/

Thanks!

You can try this 

.header-layout-branding-center-nav-center .header-nav {
    width: 100vw;
    position: absolute;
    bottom: -50px;
}

.header-layout-branding-center-nav-center .header-nav {
    width: 100vw;
    position: absolute;
    bottom: -50px;
}

Hi @bangank36! I have a default header on the site but the padding built in is way too much on one of the templates. How can I remove the padding using CSS?

On 2/23/2022 at 7:50 AM, bsholmes said:

Hi @bangank36! I have a default header on the site but the padding built in is way too much on one of the templates. How can I remove the padding using CSS?

What is your site url? We can check easier