Unwanted mystery border around around URL image via embed

Hi
I noticed there is a border added around images that are imbedded via HTML embed and I can’t figure out how to remove it.


I have messed with a few things both in the embed and also on the editor and it looks like the border is around the image or the “container” the image is in.
[background: url(https://uploads-ssl.webflow.com/5dcb0b2a8f09a460e656b7f4/5e6f7f45a4e7ff28aa19d0ad_BP_nav-2.png) no-repeat;]

I haven’t coded in years so coding may not be the best.

Here is my public share link: https://preview.webflow.com/preview/my-portfolio-c07e20?utm_medium=preview_link&utm_source=designer&utm_content=my-portfolio-c07e20&preview=5a0c5a5151c8c5e55846c78301ab0edc&pageId=5e6e8861e64d7d4049d7d836&mode=preview
(how to access public share link)

I wasn’t able to find the reason why you’re getting a small outline on your HTML box. However, I’m curious as to why you’re using an HTML embed in the first place. You could achieve that same hover interaction through webflow’s native interactions tab. Simply create a link container and place your overlay div and your background image inside, then set a hover interaction on the parent container to reveal the overlay div.

Hi Hunter,
I think I tried that route first but couldn’t get the interaction to work properly and when I tried searching in this forum, the recs for what was similar or close to what I wanted recommended html embedding as the option. I can’t remember what I actually searched but it was around having a transparent overlay layer with text become visible at hover.

Thanks for the rec I will go back and try again. Like I said I haven’t coded in years and I’m way out of practice.

Veronica,

Let me know if this helps you.

1 Like

This helps tremendously. Thank you, Hunter, for taking the time to make this quick example. You rock!

1 Like