PoppyandSeedStudio Posted October 8 Posted October 8 Site URL: https://www.poppyandseedstudio.com.au/ I want the 'Discovery, Development & Delivery' cards to stack on top of each other as you scroll for mobile view only. This is the code I've got however its not working - @media only screen and (max-width: 768px) { section[data-section-id="67050ce4e28f7b16df3c1b78"] { position: relative;} section[data-section-id="67050ce4e28f7b16df3c1b78"] #block-yui_3_17_2_1_1728383974721_11285, section[data-section-id="67050ce4e28f7b16df3c1b78"] #block-730e5033a4235ddda5e2, section[data-section-id="67050ce4e28f7b16df3c1b78"] #yui_3_17_2_1_1728428847905_511 { position: -webkit-sticky; position: sticky; top: 0; /* Stick to the top of the viewport */ z-index: 10;} section[data-section-id="67050ce4e28f7b16df3c1b78"] #block-yui_3_17_2_1_1728383974721_11285 { z-index: 30; } section[data-section-id="67050ce4e28f7b16df3c1b78"] #block-730e5033a4235ddda5e2 { z-index: 20; } section[data-section-id="67050ce4e28f7b16df3c1b78"] #yui_3_17_2_1_1728428847905_511 { z-index: 10; } }
tuanphan Posted October 11 Posted October 11 You try this CSS code @media screen and (max-width:767px) { .fe-block-yui_3_17_2_1_1728383974721_11285 { position: sticky; top: 0; } .fe-block-730e5033a4235ddda5e2, .fe-block-88fef4c6aa04912cb985 { position: sticky; top: 0; } } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment