Footer text is above the mobile menu and merges with it (Shopify, ecomposer)

[Mtt1]

I encountered a problem where the content and text of my footer after opening the mobile menu does not disappear and is constantly displayed above the menu content.

I created the footer and overwrote the default one with ecomposer and my theme is dawn.

I will be grateful for the solution

[MaverickStudio]

Hey @Mtt1 ,

Could you send the URL over so we can have a look? It’s most likely a z-index issue

[Mtt1]

www.foams-europe.com

[Mtt1]

Any further help?

[MaverickStudio]

Hi @Mtt1

They issue is with the setup of the footer section in Ecomposer landing page builder. You can fix it with the following code.

Step 1: Go to Online Store > Theme > Edit code > find the base.css file and add the following:

.core__row--columns {
	z-index: 1 !important;
}

[Mtt1]

Works perfectly but when you open the menu and scroll down it also shows the rest of the footer. Is there any way to lock the page on the bottom of menu?

[Mtt1]

Also is there any simple css code to move away the svg icon from the text? After I changed the svg icon, the text sticks to it and it doesn’t look good.