Jump to content

Change the background color of a specific row in Brine 7.0

Go to solution Solved by creedon,

Recommended Posts

Happy Friday all!

I'm currently having a devil of a time trying to accurately target and write CSS for a specific row I'd like to change the background color for. I've attached a screencap indicating the area I'd like to change. 

I want to apply this to other areas as well, but I think I can do it myself if I'm just able to see how the structure looks for this one. 

I'm trying to change the background color to #85a5aa 

Thanks in advance for any help the community can provide!

-Seth

Screen Shot 2023-01-13 at 12.35.43 AM.png

Link to comment

Please post the URL for a page on your site where we can see your issue.

A link to the backend of the your site won’t work for us, i.e. a url that contains /config/.

Please set up a site-wide password, if your site is not public and you've not already done so.

Post the password here.

Adding a site-wide password does not allow anyone to alter your site. It only allows those with the password to see your site.

Please read the site-wide password and how to share a link documentation to understand how they work.

We can then take a look at your issue.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment
  • Solution

Part of the issue is that SS uses dynamic IDs for many of the elements in a page and row elements are one. This means you have to target these types of elements escentially by position within the document.

Try the following.

#collection-57624c026b8f5b9b197478db .sqs-layout > .sqs-row > .sqs-col-12 > .sqs-row:nth-child( 11 ) {

  background-color : red;
  
  }

If the structure of the page changes, it is very likely that you will need to update the CSS. Also note that the row does not span the full page. If you are looking for that effect you'd need to adjust the page, assuming it is even possible, given the template.

Let us know how it goes.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment

This worked great! 

Yeah, it would be great if Squarespace came up with some kind of simple migration tool for those of us who have invested a lot of work into our 7.0 sites. Sections in 7.1 would make this barely an afterthought. The recent satisfaction survey I took did include questions about interest in a migration tool, so hopefully that is in the works. 

For now, this will work well enough. Thanks a lot!

Link to comment

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.