How To Center Top Menu On Infinity Pro

[Tony-BV]

Hi, I have two questions regarding the top menu on the Infinity Pro. 1. I am wondering how to center the menu tabs, it seems ever since I added the logo, the tabs are no longer centered. 2. Is there a way to add another TAB in the menu without dropping the menu to a second line and making my menu area large. Here is my website http://www.preloadedwebsites.com. Any tips would be appreciated. Thanks

[Victor Font]

You have right click disabled on your site. Without right click, we cannot access our developer tools to view your source code to help you.

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[Tony-BV]

Hi Victor, I went ahead and disabled the script so you can now right click. Look forward to your respond. Tony

[Tony-BV]

Hi Victor @vfontjr just wondering if you had a chance to take a look at my issue? Thanks in advance.

[Victor Font]

Change the CSS for .nav-primary at line 1364 in style.css. Here's the new CSS:

.nav-primary {
    text-align: center;
    margin: 0 auto;
    display: inline-block;
}

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[Tony-BV]

Thank you very much, that worked. Have a nice weekend Victor.

[Luis Gonzaga]

Hi, I am having the same problem. I tried the of Victor Font but it did not work. You can check it at http://homeoptimizer.pt/

If I replace the header title with an image (400px x 130px) the header menu is not longer centered.

Thank you, Luis

P.S. By the way, I configured this site as the documented Infinity Pro demo setup, but for some reason I had to had p tags on Custom HTML widget so the break line appear. Shouldn't it be automatic?

[Luis Gonzaga]

I think I solved the problem.

On style.css line 1170, replace "width: 200px;" with "width: 20%".

For some reason (bug?) the width of title-area is defined at 20% but when there is a header-image it is defined at 200px. This messes up with the navbar menu being centered.

/* Title Area
--------------------------------------------- */

.title-area {
	float: left;
	padding-bottom: 27px;
	padding-top: 27px;
	width: 20%;
}

.header-image .title-area {
	margin-bottom: 4px;
	margin-top: 3px;
	min-height: 65px;
	padding:0;
/*	width: 200px; - commented this line, replaced by the next one and it worked */
	width: 20%;
}

[tomatillodesign]

This worked for me. Great solution. Thank you!

[Author]

Posts