AlexJR Posted October 14 Posted October 14 Looking for some help here. I have tried two different methods of adding a floating CTA sticky button on my website. First one involves adding a section, then adding a block and selecting </>code, which I edit to have the following: <div id="customFloatingButton"> <a href="tel:293283928" target="\_blank">Call Now</a> </div> <style> #customFloatingButton { position: fixed; bottom: 20px; right: 20px; z-index: 2147483647; } #customFloatingButton a { display: inline-block; background-color: #2952a3; color: white; padding: 15px 30px; text-decoration: none; box-shadow: 0px 5px 10px -5px rgba(0,0,0,0.5); transition: 200ms; } #customFloatingButton a:hover { transform: scale(1.04); } </style> However, the button hides behind images and while it scrolls on the page, you cannot see it all the time as you scroll on mobile. The second method I followed this youtube video: https://www.youtube.com/watch?v=2O0qC9RB9NM using the code for the specific block: block-yui_3_17_2_1_1728920387578_5629 { position: fixed; z-index: 2147483647; bottom: 1%; right: 1%; height:75px; width:200px; } Still the same result with respect to the button hiding behind some images on mobile. Any suggestions welcome on fixing this. Thanks!
tuanphan Posted October 15 Posted October 15 Can you share site url? We can check problem easier 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