Image block of specific section to align to edge of screen

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

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.