Kevin on "[Theme: Pinnacle] How to increase menu width"

How can i keep all the items of my menu on one line. My 7th item is showing below. I need to increase the width of the menu. Where can this be done?

Thanks.

Can you post a link to your site so I can try to correct this with CSS?

Thanks!

http://easteco.org/ Look at the menu under about us? How can i control this? It needs to fit on the same row. Thanks.

Also how can i remove the text "no menu assigned" ? Seems like this free version has limited features. Is there any place to find clear documentation? I am not even sure going pro helps. Please advise. Thanks.

1. Since you don't have a menu assigned, I can't really give you the best solution to align it into one row.

2. You can remove that with this CSS:

.kt-nomenu-assigned { display: none;
}

You can find documentation for the theme here:
http://docs.kadencethemes.com/virtue-free/

Let me know if this is helpful!

I forgot to say above that all custom CSS goes into Appearance> Theme Options> Custom CSS. I also gave you the wrong link to the doc site.

Shoulve been here:
http://docs.kadencethemes.com/pinnacle-free/

I have top menu assigned. I tried using primary navigation and the lines could not fit. Let me set it up for you to see.

Please check and see. I assigned my menu to primary navigation and as you can see, the contact us item starts on another row. Thats why i had used the top menu. I have fixed the no menu text issue (thanks).

Try adding this CSS to Theme Options> Custom CSS and let me know if it works for you!

.kad-header-style-basic #nav-main ul.sf-menu>li>a { padding-right: 2px;
}
@media (max-width: 1200px) { .kad-header-style-basic #nav-main ul.sf-menu>li>a { padding-left: 2px }
}

Wonderful!!. The "contact us" item is now on the same row. Wow (Thanks alot for that) - this is solved..

But still in the top menu, under the item "About us", each single item appears on two rows instead of one. This appears correctly in the primary navigation menu.

Are you talking about how the items drop down below the topbar when the screen size decreases? If so, try adding this CSS.

@media (min-width: 992px) {
.kad-topbar-right { width: 80%;
}
.kad-topbar-left { width: 20%; }
}

Let me know if that's what you meant.

yeah, exactly, i meant how the items drop below the top bar, for example, under the item "About Us" on chrome, the first two items (Historical Background and Mandate and Functions) display on 2 rows/item. On firefox only the second item displays on two rows. I have added this last code but nothing changes.

Try clearing your cache. It looks like the CSS I gave you is working on my end.

If after clearing your cache the problem persists, post a screenshot of it and I'll do what I can to figure out a solution.

Hello, nothing changes my end. I have even tried on two separate machines. (chrome + firefox)

Hi, how can i change the background image on this page? http://easteco.org/about-us/historical-background/

How can i post a screenshot on this page?

I see your site is now in maintenance mode. I'm back on the forums so if you'd like to make it live again so I can help you out, let me know.

I use this chrome app to post screenshots, but there are a lot of options out there to do so.

https://www.awesomescreenshot.com/

Hi, my site is now online. I updated the them, and now all the work i did is messed up again. The contact us item is on another row again.

Hi, this code no longer has any effect.

.kad-header-style-basic #nav-main ul.sf-menu>li>a {
padding-right: 2px;
}

@media (max-width: 1200px) {
.kad-header-style-basic #nav-main ul.sf-menu>li>a {
padding-left: 2px
}
}

Is somebody available to assist? Thanks

If you can make your website visible again, I'll be able to assist you now.

Hi, can you please remove the information regarding my website from this thread as i am receiving alot of spammers seeking to assist me? Please let me know when you are available and i'll make the site visible

that's no good! I don't have admin permissions to remove it, so you'll have to contact someone on this site to do that.

I'm on here for another 20ish minutes if you want me to assist now.

Ok, please check out my site. After updating the theme to a newer version, the "contact us" item is now on another row. The code that initially worked stopped working. How can i get it to function again?

Replace the previous CSS I gave you that effected the padding of the menu items with this:

.kad-header-style-basic #nav-main ul.sf-menu>li>a { padding-right: 10px; padding-left: 10px;
}
@media (max-width: 1200px) {
.kad-header-style-basic #nav-main ul.sf-menu>li>a { padding-right: 1px; padding-left: 1px; }
}

in your apperance > theme options > logo options. Set the logo width to like 25% or 16%

Kadence Themes

Thank you very much Kevin & Kadence Themes. Things are back in place now. Thanks Alot.