Home link in menu offset

[powrider686]

Hi there!

On my site https://jobsiteus.wpengine.com/custommetalfabrication/ and https://jobsiteus.wpengine.com/, which are two different subsites on a multisite install, the home link in the navigation is offset from the rest of the navigation and I can’t figure out why. Can you help me get that back in order?

Thank you!

[basanta]

Hi @powrider686,

Thanks for writing in!

The issue is due to the dropdown indicator of the second menu item, which is down a little.

To fix the issue please add this to your X-> Theme Option -> CSS and let us know if that helps!

.x-navbar .desktop .x-nav li>a>span:after {
font-size: 15px !important;
}

Hope this helps!

If you would like to learn CSS, I am sharing few resources that you take a look to get started with CSS and an interesting tool that you can use to speed up the development process.

I recommend you to watch following video that will help you to get started with CSS.

https://www.youtube.com/watch?v=MFR4WXiLzpc

Sometimes it can get a bit difficult to find out the right selector to be able to write the required CSS codes. A handy tool that can help you in this is Google Chrome dev tools. I am sharing the resource that you can refer to get started with dev tools.

https://developers.google.com/web/tools/chrome-devtools/css/

https://developers.google.com/web/tools/chrome-devtools/

https://www.youtube.com/watch?v=tP_kXBJWPhQ&t=200s

Thanks.

[powrider686]

Hey Basanta,
Thanks for the fix, that worked.

Why would the rest of the icons be offset down from center? I don’t have anything set up so that they would be that way, and now that you mention it, I’d like to get that fixed.

Any ideas?

Thanks for the help!

[paul.r]

Hi,

It’s because of the font that you are using, Somehow 18px of your font(Cuprum) and 18px of the icon(fontawesome) are not of the same size.

So to make it align, you need to reduce the size of the icon a bit like 15px with the code that my colleague have provided.

Thanks