Hi guys
I am a bit lost right now.
Already searched this forum everywhere and found some things but nothing worked for me so far.
I just would like to have my SVG without any hover effect as the arrow and the white background as it does not look good.
HTML Code so far (CSS adjustments did not work so far):
<a href="https://www.startpage.com"><img class="start-image" src="https://www.startpage.com/wp-content/uploads/2018/09/Logo.svg" width="300px" alt="Test"></a>
Thanks for any help
Michael
Hi Rikard
Thanks for your reply.
Unfortunately I can’t give you access to the website due to the contract with the customer. Furthermore, the website is not live yet.
I already tried to make the background of the image overlay transparent, remove the transition etc. – nothing solved my issue for the SVG so far. Maybe it is because it is not embedded as normal image, but via code block as I posted above.
Best
Michael
try this in quick css:
The thing is that you have to select the direct neigbour of an element with that ( + )
.start-image + .image-overlay {
display: none !important;
}
maybe you give to the image a hover effect that not only the pointer hand indicates a link
.start-image:hover {
-webkit-filter: drop-shadow(2px 2px 3px #666);
filter: drop-shadow(2px 2px 3px #666)
}
Hi,
Thanks for helping out @guenni007, did you try that suggestion out and did you have any luck with it @michaelH?
Best regards,
Rikard
Thank you very much Günter – your solution is great and works like a charm!
Hi michaelH,
Great, glad you got it working and thanks again to @guenni007 for helpin out :-)
Please let us know if you should need any further help on the topic or if we can close it.
Best regards,
Rikard
Hi Rikard
You can close this topic, thanks a lot.
Best regards
Michael
Hi,
Glad we could help!
Please take a moment to review our theme and show your support https://themeforest.net/downloads
Don’t forget to bookmark Enfold Documentation for future reference.
Thank you for using Enfold :)
Best regards,
Basilis