SimonG Posted November 3, 2021 Share Posted November 3, 2021 (edited) Site URL: https://www.simonguillemin.com/travel-snowflakes Hey dear folks & the boss @tuanphan 🙂 I would like to make the right column of a page which contains differents block (text + image + shop button) fix when scrolling down the page. I want people be able to see the content on the left while they can always get acces to the text of the right. Also I would need this fix column on the right stop before the bottom of the windows just before the large block picture at the bottom https://www.simonguillemin.com/travel-snowflakes password : 0009 THANKS A LOT for your help 🙂❤️ Edited November 4, 2021 by SimonG Tag someone : @tuanphan Link to comment
SimonG Posted November 4, 2021 Author Share Posted November 4, 2021 I tried this without success : /* sticky text */ @media screen and (min-width:50%) { div#page-section-yui_3_17_2_1_1636017274785_162.row .span-4 { position: sticky; top: 0; } } Link to comment
SimonG Posted November 5, 2021 Author Share Posted November 5, 2021 Up 🙂 @tuanphan if you come here 🙂 Link to comment
tuanphan Posted November 7, 2021 Share Posted November 7, 2021 Add to Design > Custom CSS @media screen and (min-width:768px) { div#page-section-617ffbaaf731bf2ea98d7116 .span-6:last-child { position: sticky; position: -webkit-sticky; top: 80px; } } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
SimonG Posted November 7, 2021 Author Share Posted November 7, 2021 @tuanphan Thanks a lot ! Could you explain to me why did you set min-width on 768px ? And also why does it fix only the right column whereas the #617ffbaa..... code seems included the 2 columns ? Link to comment
tuanphan Posted November 8, 2021 Share Posted November 8, 2021 On 11/7/2021 at 3:55 PM, SimonG said: @tuanphan Thanks a lot ! Could you explain to me why did you set min-width on 768px ? And also why does it fix only the right column whereas the #617ffbaa..... code seems included the 2 columns ? If don't set 768px, it will run on mobile. It will be ugly on mobile (If you want to test on mobile, just change 768px to 1px Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment