Logo in header not centered (horizontal)

Hello,

how can I center the logo in the header?

See attached screenshots of the settings. If I change the Row flex layout to the “flex – centered – flex” the menu item Search is right next to the centered logo.

Kind regards,
Christian

Attachments:

You must be logged in to view attached files.

Hello,

Here is our article with more details about those settings, please check – https://xtemos.com/docs-topic/header-rows-flex-layouts-2/

In case you have additional questions, let me know.

Kind Regards

I checked the documentation. After reading that, it seems as a bug to me. Or why is the search menu item directly on the right from the logo and all other menu items are right aligned?

[Luke Nielsen]

Hello,

The thing is that you use a menu with 1 item to show the “My Account” so the entire menu is stretched to the full width to align internally.

So I suggest you define the “Account” element with the “Only text” value – https://prnt.sc/Ppe9aSSj01mW, either use the code below to override the styles.

.xts-header-main .xts-nav-wrapper {
    flex: none;
}

Kind Regards

• This reply was modified 4 days, 16 hours ago by Luke Nielsen.

Hey Luke,

yes, in the meanwhile it was only the account – true. I changed it to your recommended way and it works.

I only have the font color problem on the search and My Account on the default header (Header Overlap – start page and everything else) and the shop page (Main Header):

This is accorded to the changes here: https://xtemos.com/forums/topic/how-to-change-font-color-of-the-header-when-hovering-the-section/

See loom and temporary login in extra information, please.

Could you please provide a css that it looks fine on both headers? 🙂

Hello,

Add the below code for help – https://prnt.sc/ag7inhaxsfVN:

body:not(.single-product, .woocommerce-shop) .xts-header:not(.xts-sticked):hover .xts-header-el-label {
    color: #1a1a1a
}

body:not(.single-product, .woocommerce-shop) .xts-header.xts-sticked  .xts-header-el-label {
    color: #1a1a1a
}

Result – https://gyazo.com/d97ed6c841db3a6ace2ce59e0d4e5d5e

Kind Regards

Thank you, that works fine!

[Author]

Posts