Hi- thank you for this. I am struggling to get it corret - when you put the custom CSS in, the button didnt move. You then said you will show us another way with your user-friendly css - which then worked. How do you get that extra side tab CSS ? otherwise how do you make it work just the usual custom css way?
Everything looks great on PC and I adjusted my relative position to be in the bottom left of the image. This is exactly what I wanted. However, the issue I am having is if I scale the window down the button does not keep its relative position and does not scale down, rather, it stays the same size and pushes off to the left of the image. Any suggestions as I try to make this work for mobile and tablet or smaller chrome windows?
Why is so complicated to have a simple button over an image like all sites? Thought Divi was an advanced theme when I bought it. I made the image as background and added the button over it and used position to change its position to the middle of the image with the Vertical positioning. When I did that it became a layer behind the image and not clickable! Any simple solution?
I have tried this and the button does not move - just like it didn't move on the video before you used the Chrome code extension. Please help. Thank you.
Whilst this works yes. It messes up the rest of my entire homepage :( I have tried to put the CSS everywhere to just the column to just the image it self but it doesn't work. The only way it works is by adding it to the page CSS and that roots all other aspects of what I have on my home page but the image with button on them looks fine. Also altering the spacing within the CSS moves it where I want in a preview however once saved it goes to the center. Again that's not as important as this screwing up the entire rest of the page, but do you have any tips or suggestions how to apply this method to just the bloody image column I want? Cause this is exactly wat I'm looking for but it doesn't work with the rest of my site. Thanks.
Hi, I tried this tutorial it worked great for what I need but I've noticed that its not responsive on tablet size - specifically iPad mini. Is there any code for this? thanks!
Thank you, every video on this channel is a golden coin. 😊👍🔝
You're welcome, it's my pleasure! 🙂
Hi- thank you for this. I am struggling to get it corret - when you put the custom CSS in, the button didnt move. You then said you will show us another way with your user-friendly css - which then worked. How do you get that extra side tab CSS ? otherwise how do you make it work just the usual custom css way?
Thanks! Really appreciate the effort. Made the changes to a couple of images on my new site and it works and looks great.
Great to hear!
Just thank you a lot. This was a perfect solution to something I was trying to do. Really appreciated.
That's great to hear, you're welcome!
Thanks for your helpful videos! Please keep up the good work!🔥
You're welcome! I will keep it up 😊
you are a God-sent again!!!! Thank you so much! you are helping me so much!
I'm so glad to hear that!
can I do this on the product in the shop page? and please if I could how can I do it I wanna add the add-to card on the product image to show on hover
Great tutorial, I agree it’ll be most popular one👍🏽 Thanks
Yes my previous one was very popular about this topic and this one is better.
Brilliant and efficient! Nicely done. Love the video! Thanks for sharing these nuggets of wisdom.
Glad you like it, I really enjoy sharing each week!
great tutorial! Can you add more than one button to a single picture?
I will add some media-queries so the hover will be only on desktop and not on mobil or tablet.
Very good point there!
I need to do the same thing, how did you do it?
😅 another question how can I show the code tap that you're using it's nicer than "inspect"
the code for "Add The CSS Snippet To Your Website" does not work, the first two yes
Everything looks great on PC and I adjusted my relative position to be in the bottom left of the image. This is exactly what I wanted. However, the issue I am having is if I scale the window down the button does not keep its relative position and does not scale down, rather, it stays the same size and pushes off to the left of the image. Any suggestions as I try to make this work for mobile and tablet or smaller chrome windows?
Why is so complicated to have a simple button over an image like all sites? Thought Divi was an advanced theme when I bought it.
I made the image as background and added the button over it and used position to change its position to the middle of the image with the Vertical positioning. When I did that it became a layer behind the image and not clickable! Any simple solution?
I'm not sure, if something isn't working with the tutorial please leave a comment on the post.
Does it work if the layout is 2 columns?The text on the left but the big image on the right that goes far under the left column
I'm not sure what you mean. Should work fine with any number of columns.
what is the extension's name to do the css on googgle chrome ?
User CSS
Thanks again for a great video totally agree with Mr. Mirko Mancini is a golden coin.
You're welcome! So happy you like them!
Excellent. You always deliver amazing content.
I'm so glad you like it!
I have tried this and the button does not move - just like it didn't move on the video before you used the Chrome code extension. Please help. Thank you.
I'm not sure what you mean.
Whilst this works yes. It messes up the rest of my entire homepage :( I have tried to put the CSS everywhere to just the column to just the image it self but it doesn't work. The only way it works is by adding it to the page CSS and that roots all other aspects of what I have on my home page but the image with button on them looks fine. Also altering the spacing within the CSS moves it where I want in a preview however once saved it goes to the center. Again that's not as important as this screwing up the entire rest of the page, but do you have any tips or suggestions how to apply this method to just the bloody image column I want? Cause this is exactly wat I'm looking for but it doesn't work with the rest of my site. Thanks.
It's not clear to me what issue you are facing, as the tutorial does not cause any issues. You can try leaving your comment on the blog post.
what is the css writer chrome extension name ??
User CSS
Super helpful! Thank you so much
You're welcome, so glad it was helpful!
Thanks for the great tutorial!
We just have one question, would this work if you have multiple images in a column, with multiple buttons?
can I do this with a full length image?
I'm not sure what a full length image is, but why not?
Hi, I tried this tutorial it worked great for what I need but I've noticed that its not responsive on tablet size - specifically iPad mini. Is there any code for this? thanks!
Responsiveness is not relevant to this code, as far as I know. But you can certainly adjust what it is within the modules.
Hmm this didn't work for me. The text height moved up one line but didn't go anywhere near centre of the image.
Not sure why, keep adjusting?
@@PeeAyeCreative this happened for me also, the top percentage adjustment doesn't work for me, but the left one does. any ideas? cheers
Same here
super - thanks very much - love your style
That's great, I'm glad 😊
Is there a reason not to use Negative margin to place the button on the image in the column above it ?
It would work, but it would always be wrong depending on screen size/aspect ratio.
does everything involve CSS?
I'm not sure what you mean, but if you are asking about my tutorials specifically then yes typically my customizations are intermediate.
This is great, thank you!
You're very welcome!
What is the name of the chrome extension.thanks🙏
User CSS
Hello ! Thank you very much ! I would to know you test the code to web developper in front.
I am using a Chrome extension called User CSS
@@PeeAyeCreative tks
It's realy work when I use that extension but not work when I apply it to my wordpress child
I don't know what you mean.
Wow! Awesome! 👍
Cool 🎉
😊
Thanks - so useful
Great👍👌
Glad you like it!
thanks help
You are most welcome
Tried. Does not work. SAd.
It does work, so try again or share more details in the blog post.