Make background two different colors on top and bottom

Site URL: http://www.littleemberslearning.co

@tuanphan

I am trying to make a two-toned background on a specific page using SquareSpace 7.1. I can't seem to target the right element. It works ok on desktop but not on mobile. It seems like it's not targeting the entire background. Here is the code I'm using:

/*Background half color*/
div#page-section-5ebb04baaf3da51700fbbdba{
  background: linear-gradient(0deg, #264a53 60%, #fff 40%);
}
@media only screen and (max-width: 640px){
div#page-section-5ebb04baaf3da51700fbbdba {
  background: linear-gradient(0deg, #264a53 80%, #fff 20%);
}
}

Any help would be appreciated! 

Try target data-section-id, find id with this tool https://chrome.google.com/webstore/detail/squarespace-id-finder/igjamfnifnkmecjidfbdipieoaeghcff

@tuanphan

Thanks. I use a similar tool: https://chrome.google.com/webstore/detail/squarespace-collectionblo/bggpdfnccodbnmcndckmeehdjkjojkde

Attached is the target data. I still can't quite figure out how to target the specific page background. 😞  

The tool I sent works both SS 7.0 & 7.1

Your tool seems work 7.0 only

Hi, Can you describe in detail your problem? Don't really understand the question.

I want the top half of my home page body section to be white. I want the bottom half of the body section to be #264a53. If you look on mobile, it's not targeting the entire body section.

I figured it out. Squarespace 7.1 doesn't have page identifiers so I had to find the section-id. Thanks @tuanphan for getting me going in the right directions.

Here's the code I used:

[data-section-id="5ebb04baaf3da51700fbbdba"] .section-background
  {
  background: linear-gradient(0deg, #264A53 60%, #FFF 40%);
  }

On 5/27/2020 at 9:38 AM, LittleEmbers said:

I want the top half of my home page body section to be white. I want the bottom half of the body section to be #264a53. If you look on mobile, it's not targeting the entire body section.

Hi. Did you solve?