Jump to content

Image block of specific section to align to edge of screen

Recommended Posts

Site URL: https://squid-strawberry-dwl2.squarespace.com/product-overview-1

Hi Tuan! you seem to be the almighty wiz so I hope my question goes through.

I have a similar issue, but need a specific image of specific content block to align fully to the right edge of the screen. 

I tried copy your code from the previous response but it didn't work. I have the 'Squarespace Collection/Block Identifier' extension and tried copying the # ID but think i'm lost.

The site is in trial mode meant to launch on Friday:
https://squid-strawberry-dwl2.squarespace.com/product-overview-1
password: october

Any ideas?

Thankful for help

 

 

Screenshot 2021-10-20 at 21.48.53.png

Edited by Cams
Link to comment
section[data-section-id="61706cb56765230a8ca03d86"] {
.page-section > .content-wrapper {
max-width: 100%;
padding-right: 0 !important;
}
}

Without doing any other optimizations the quickest solution to get your image on the right of the screen is to just override the section default padding and max-width. You'll then need to use spacers or custom CSS to adjust the layout and sizing's if you want.

If I remember correctly, you should be able to apply a spacer to the left of the section and between the text to bring it in a bit more like the original layout.  IMO - this is the easiest way of doing something like this, otherwise you'll likely be doing all of the positioning yourself.

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.