Jump to content

Help! Custom CSS split screen for mobile, text over image.

Recommended Posts

Hello, I have an issue with Custom CSS split screen. On desktop the split screen works perfectly but on mobile text is over the image. I need the text to be below the image. All the split designs are now broken on mobile. My website : https://zeynaagency.com/ 

Could you please help ? Here the code I used  :

section[data-section-id="63514b39bf5a053a82731917"]{
  @media only screen and(min-width:767px){
    .section-background{
      width:50%;
      margin-left:50%;
    }
    .content-wrapper {
      width:50%;
      margin-right:50% !important;
    }  
  }
  @media(max-width:767px){
    display:block;
    .section-background, .content-wrapper{
      position:relative;
    }
    .section-background{
      height:500px;
    }
  }
}

Thank you for your help!

Juliette

 

Capture d’écran 2022-11-13 à 14.17.09.png

Capture d’écran 2022-11-13 à 14.17.03.png

Capture d’écran 2022-11-13 à 14.16.55.png

Link to comment
  • Replies 1
  • Views 208
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.