Menu suddenly aligned wrong

Paul Frankowski Senior Staff

4 years ago · edited

Hi,

hopefully easy to fix. One of solution:

1. Here: templates/shaper_helixultimate/css/custom.css
2. Add the below custom CSS,
3. then clear browser cache deeply. Tip was also inside Helix documenation.

#sp-menu .align-items-center.justify-content-end {
    justify-content: center !important;}

Ariba Staff

4 years ago

Hello

Thank you for your query.

Please go to "Template Options", from "Basic" settings select "Fullwidth Center" as the header and see if it helps.

AW

Anders Wiik Asked this

4 years ago

Sorry, Tried both and still the same result. Menu aligned to the right.

Seems lite more css code has vanished. Links that are active are suddenly black which was white before...

/Anders

Paul Frankowski Senior Staff

4 years ago

Test on different browser maybe, seems to be OK

AW

Anders Wiik Asked this

4 years ago

Sorry again, I was wrong. It is centered. Must have been cache....
The menu is with transparent background and when scrolling down it turns white but now it is not 100% width as before.
See picture:
https://www.dropbox.com/sh/b0wct0ydhokrv6k/AACUEHhyNaRs-C6U_Cbm6aEga?dl=0

• active meny item is black. Should only be black when white background.

Paul Frankowski Senior Staff

4 years ago

add also this:

.sp-megamenu-wrapper.d-flex {
    width: 100%; justify-content: center;}

AW

Anders Wiik Asked this

4 years ago

Changed this as well but have still design difference since before upgrading.

Paul Frankowski Senior Staff

4 years ago

what is missing?

AW

Anders Wiik Asked this

4 years ago

when scrolling down on the page the menu should change color and have the width of 100% of the page size.
This has changed and I demonstrate it in the picture:
https://www.dropbox.com/sh/b0wct0ydhokrv6k/AACUEHhyNaRs-C6U_Cbm6aEga?dl=0

Seems to be that custom css has been overwritten when the upgrade took place.

Paul Frankowski Senior Staff

4 years ago

Sorry, my mistake I forgot to paste you also this line

#sp-header.header-sticky .sp-megamenu-parent {
    width: 100%; }