Javdesign Posted March 12 Share Posted March 12 Hi all, What do I need to place in custom CSS to disable a css effect only on mobile? I am finding that making the top section sticky upon scroll wigs out on mobile and sort of blinks and also shows the top section through the background of other sections, so I just am going to opt to "disable" it on mobile view. Unless it can be fixed to work OK on mobile?? (FYI: This is the code I am using to make the first section of my homepage sticky and the other sections scroll up and over it.) section[data-section-id="place unique section ID in here"] {position: sticky!important; top: 0px!important} html {scroll-behavior: smooth} Link to comment
Solution sorca_marian Posted March 13 Solution Share Posted March 13 You can use a CSS media query to only display it on larger screens @media (min-width: 768px) { /* Your code here */ } 👨🔧👨💻 Contact me for development and design work - Freelancer Software engineer, Architect, and Designer UI/UX 🙋♂️ Squarespace Custom Web Development & Design 📅 Manage Tasks, Take Notes, and Upload Related Images 📹 Squarespace Tutorials for free - YouTube📹 💯🚀 I have worked on over 200 Squarespace sites with custom code for over 9 years 🙋♂️ Let's connect on LinkedIn Link to comment
Javdesign Posted March 13 Author Share Posted March 13 Thank you! That worked! sorca_marian 1 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