CocosAtelier Posted July 14, 2020 Share Posted July 14, 2020 Hi all, I have a little diamond image that I I would like to overlap the hero. You will see the hero image actually has the diamond on it but rather than displaying it that way I would like for the png that I added to overlap that section so it looks better on the parallax. I have this code but can't get it to work. /* remove section bottom padding */ [data-section-id="5ef91d882801f1255c12e37b"] .content-wrapper { padding-bottom: 0 !important; } /* remove overflow hidden */ div#block-yui_3_17_2_1_1594737404430_275 .image-block-wrapper { overflow: visible !important; } /* overlap image */ div#block-yui_3_17_2_1_1594737404430_273 img { width: auto !important; bottom: -20% !important; top: unset !important; right: 0; z-index: 999; } My website: www.cocosatelier.co.uk password: caview23 Any help would be very appreciated, thank you in advance. Chanel Link to comment
tuanphan Posted July 15, 2020 Share Posted July 15, 2020 Can you share link to page where you inserted diamond image? 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!) Link to comment
CocosAtelier Posted July 15, 2020 Author Share Posted July 15, 2020 Hi Tuan, Thank you for your help. The diamond link: https://images.squarespace-cdn.com/content/5eea9f18d522a654baa80b9b/1594577282957-FV6G7A5E5K82HZNFQW4H/diamond.png?content-type=image%2Fpng Your code has worked for me but I was wondering if there is a way of locking it into place so it does not shift to another position on any screens? Is that possible? Also how can I make it smaller? I tried to resize it by adding the width but it moved the position also. Thank you so much Chanel Link to comment
Recommended Posts
Archived
This topic is now archived and is closed to further replies.