saithstudio Posted June 10, 2022 Share Posted June 10, 2022 Site URL: https://www.poornilindenfeld.com/ Hi there, I'm working on a sight with a series of split sections with an image on one side and a text block on the other. I decided to search for some custom CSS to make the image blocks sticky on scroll. I found some CSS online and tried it on my sight and everything worked fine. Flash forward two or three weeks: I have added another split section which needs the same CSS applied to it. But now I can't figure out how I managed to do it before. Here's the code already in place: #page-section-622dffcc6ac2e8678da6b0d9 .sqs-col-12 .sqs-col-5 { top: 34px; position: -webkit-sticky; position: sticky; } #page-section-628f23c854ede010df2681f3 .sqs-col-12 .sqs-col-5 { top: 34px; position: -webkit-sticky; position: sticky; } #page-section-626908847683d664da730e01 .sqs-col-12 .sqs-col-5 { top: 34px; position: -webkit-sticky; position: sticky; } #page-section-626926c186dffd7e48f3cae3 .sqs-col-12 .sqs-col-5 { top: 34px; position: -webkit-sticky; position: sticky; } #page-section-626926c186dffd7e48f3cae5 .sqs-col-12 .sqs-col-5 { top: 34px; position: -webkit-sticky; position: sticky; } #page-section-626926c186dffd7e48f3cae7 .sqs-col-12 .sqs-col-5 { top: 34px; position: -webkit-sticky; position: sticky; } #page-section-626926c186dffd7e48f3cae9 .sqs-col-12 .sqs-col-5 { top: 34px; position: -webkit-sticky; position: sticky; } #page-section-622de5a4e3e56b3665bcd5ce .sqs-col-12 .sqs-col-5 { top: 34px; position: -webkit-sticky; position: sticky; } It seems simple enough, but now I can't seem to find the "#page-section" ID for the new section. All I can find is the "#block-yui" or "#collection" ID or whatever. Did my ID finder extension change somehow? I'm at a total loss here. Any advice would be great! site link: www.poornilindenfeld.com pw: saith Link to comment
tuanphan Posted June 13, 2022 Share Posted June 13, 2022 I see sticky sections work fine here. Did you solve this? You can use [data-section-id] instead. It is similar with #page-id. The ID Finder Tool will show data-section-id. As far as I know it can't find #page-section-id. 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
saithstudio Posted June 13, 2022 Author Share Posted June 13, 2022 I managed to get it to work a few weeks back, but now I have just one new section where I need to replicate the effect (see the home page, under where it says "Therapy For..."). I can't figure out how to replicate it though. I've tried using [data-section-id], but to no avail. Maybe I'm typing it incorrectly? I'm pretty clueless with CSS to be fair. Link to comment
tuanphan Posted June 14, 2022 Share Posted June 14, 2022 16 hours ago, saithstudio said: I managed to get it to work a few weeks back, but now I have just one new section where I need to replicate the effect (see the home page, under where it says "Therapy For..."). I can't figure out how to replicate it though. I've tried using [data-section-id], but to no avail. Maybe I'm typing it incorrectly? I'm pretty clueless with CSS to be fair. Use this div#page-section-628f23c854ede010df2681f3 .span-5 { position: sticky; position: -webkit-sticky; top: 0; z-index: 9999; } section, article, #page, body { overflow: visible !important; } 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
saithstudio Posted June 14, 2022 Author Share Posted June 14, 2022 YES! That works! Thank you so much! 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