Hi the community,
I can’t understand why I have a 1 px border added automatically to my header image.
I inspected the element (image) in Chrome and it says that I have a border-image-width property of 1. (see little border in the image attached)
Has anyone had this problem and know how to fix it?
Thanks in advance!
Here is my site Read-Only: LINK
(how to share your site Read-Only link)
Please add screenshot (No image attach).
To begin with, .hero-section probably needs to be overflow:hidden.
Thanks for your quick answers @Siton_Systems & @vincent !
Here is the screenshot 
@vincent I do it right now.
@vincent It didn’t change anything for the moment.
Here is a cropped screenshot to show you more in detail the tiny border added.
@vincent any clue or another trick to remove the border 
?
What’s the border, that gray thing? 
Exactly this tiny border.
No border applied to my image, no background… and in my Figma file nothing appears. I have no clue.
That’s inside of your image, so nothing can be added by Webflow in it, that’s how your computer renders your image, it seems to not be very good at rendering the alpha.
I don’t see the issue here at all.
Yes it did, it fixed a bug you hadn’t see 
Ok I know why you have this bug.
Your image is huge, 3000px approx. and you’re not using it at size 1:1. Which is problematic for many reasons. You’re making Webflow use it at a smaller size and the shrinking, at various ratio, make the line appear. So figure out the size you need your image to be and make it that size exactly and use it in Webflow without resampling/resizing it. (and do that for ALL and EVERY image on a website, never ever scale it on the fly.
Thanks @vincent !
And for the tip too! I try this right now.
Merci @vincent comme diraient les français!
Tu mérites ton titre de Webflow expert
Bonne journée.
Cool Clément ! Merci et bonne journée à toi !
