My Mobile Menu Seems To Be Stuck Behind The Ai Generated Hero

Technical Q&A
,
1

I’ve tried checking this out however I need you to help me out, please advise how we can do that.

2

Share your store url for more context..

3

https://sucu-beauty.myshopify.com/\

4

Ai generated sections always look like that, they dont fit all the devices, I have tried, too many better to make your store homepage with bpage builder.

5

Since this section was built using an AI or a Page builder, the ID is dynamically generated and can change anytime you update or rebuild the section. Instead, I am targeting the first element inside the container which is your hero section. This way the fix keeps working even if a new ID gets generated.

Paste this in your base.css file:

css

#MainContent > .shopify-section:first-child {
  z-index: 0;
  position: relative;
}
6

Thank you so much ! Lol I’ve been fighting for this so much

7

If one would go to this Section settings-> Custom CSS this code produce the same result:

{
  z-index: 0;
  position: relative;
}

Theme engine will supply proper selector automatically.
This code, however is invalid if used elsewhere.