WhoAJ

@paul2009 your code has allowed me to add the sizes on my main t shirt shop page -> (https://calliope-kumquat.squarespace.com/t-shirts pw: hi ) If you click in to the White T you will notice I have some sizes that have no stock therefor a grayed out. link to white t -> (https://calliope-kumquat.squarespace.com/t-shirts/p/country-feast-set-3nybt-dtlhz-4brte-5969w) my issue is: on the main products page (first URL link ) the sizes that are out of stock are not showing as out of stock on that page. can you please assist? I'm not sure if its because of my existing code: (i have tried playing around with it but can't seem to get it to work) /* hide sold out price */ .sold-out .product-price { display: none !important; } /* hide add to cart button when sold out */ .sold-out .sqs-add-to-cart-button-wrapper { display: none !important; }

@tuanphan hello friend, merry christmas and thank you for the code, works like a beauty. and thanks for helping th Community

HI @tuanphan link below for one of my product pages https://capybera-krill-9nzw.squarespace.com/hierarchy-tees/p/relaxed-tee-grey

@tuanphan hello sir , i remebered you helped me with an alignment issue above. i have another issue i want to run by you. on my product page the productitem-additional info box seems to be different sizes on different monitors. (13 inch and 15 inch laptop). so if i change the width it looks good on one and out of line on the other. see photos attached. photo one from my 13 inch laptop it looks off. photo two it looks perfectly in line from adjusting in my css. Ideally if it were the same size as the add to cart button on any screen that would be great https://capybera-krill-9nzw.squarespace.com/config/pages/website-tools/custom-css pw: hi code i used: .ProductItem-additional { padding-left: 730px !important; margin-top: -140px !important; font-size: 15px !important; width: 35%; thank. you

solved by @tuanphan here and here

@tuanphan i was just messing with the attributes to see what effect they have so i can learn. i changed them back to what you gave me 🙂 last last question how can i adjust height to make it lower or higher? fo future reference? will mark this as solved and tag you in my other post .

@tuanphanoh wow thank you very much. I just have one question. how can i scale down the size of the words to just cover the two centre photos? like the below photo

I have put in the code in the settings > advanced and saved. <style> .Main {background-color: #000000 !important; } </style> but the page still appears the same. also tried using collections in css - #collection-657167bc475a9a5366cdf001 { background-color: #000000 !important; } im trying to change this page https://groundhog-cow-f7s6.squarespace.com/about pw: hi

yes please sir @tuanphan

Sorry to jump in on this @tuanphan i'm trying to achieve something similar. im trying to move the HIERARCHY text box up to overlay the grid. essentially i would like the top of the text aligned with the top of the images . i used the below css but when i viewed my page on a different monitor it appeared to be lower. see here #block-360c253ea77246c3281e { top: -640px !important; Site: https://groundhog-cow-f7s6.squarespace.com/ PW: hi

attached photo of how it looks on my monitor. everything looks scaled fine apart from the text box being at the bottom. on my laptop the "shop all" button is hidden further below

hi @melody495 thanks for reviewing my issue. i turned off that bit of code, my text box is now located below the Grid Gallery image strips. it does not let me drag the text box to put it over the grid stips. Hence using css to try and position the text box vertically up top.

the large text box "Hierarchy" on my home page drops further down when i view the site on a different sized monitor. to put in perspective, I have been working on my site on a MacBook pro 13 inch. Everything looks fine I switched to my other laptop 1920 x 1080 and monitor 2560 x 1440 and that's where i noticed the difference. (not sure how useful this info is ) This is the code i use to reposition the text box to move it up more. //hierarchy large logo positioning// #block-360c253ea77246c3281e { top: -640px !important; } Site: https://groundhog-cow-f7s6.squarespace.com/ PW: hi

nvm i figured it out using .gallery-strips-item img { transform: scale(0.95) !important; } @media only screen and (max-width: 767px) {.gallery-strips-item img { transform: scale(0.95) !important; }}

@tuanphan hi i'm trying to do something similar i'm using gallery strips on my home page only on web it shows fine, 4 images across but on mobile, it pushes the 4th image down. is there a way to have 4 images across on mobile ? i'm fine with the images getting smaller https://lavender-oval-sydh.squarespace.com/ pw: hello thank in advance i asked for help here