Assistance Needed: White Line Issue on Image Banner!!

[macamaca]

I'm having an issue on my website, vibeonwheels.com, where a white line appears at the bottom of the image banner. It seems to be related to the section or a gap between the image and the next section.

I've tried adjusting the CSS, but the line is still there, especially on mobile. Could you please help me fix this? Password is piebre

 

[Liquid_xPert_SJ]

@macamaca 

Can you please provide the store front password because currently its protected.

Thanks

[macamaca]

Password is piebre

[gutenplayer]

@macamaca 

Hope you are well

Please go to

1) Online store

2) Themes -> Edit theme

3) Layout

4) base.css and paste this code on the end

.banner__media.media.scroll-trigger.animate--fade-in img {
    height: calc( 100% + 2px );
}
​

I hope it works for you, let me know, and If you'd like to discuss this more about this, don't hesitate to send me a PM/DM

[macamaca]

I did but it didn't work

is it wrong path?

[gutenplayer]

@macamaca , its maybe overright this css
can you please try with 
.banner__media.media.scroll-trigger.animate--fade-in img {
height: calc( 100% + 2px ) !important;
}
​

[Rahul_dhiman]

Hello @macamaca 
Please provide password also 

[macamaca]

My password is piebre

[Edgywebsites]

You can follow the steps below to fix this:

On your code editor, open section-image-banner.css.

Go to line 162 and replace it with the following:

height: calc(100% + 2px);

Save the file. This should solve it.

[macamaca]

Sorry it didn't work

[namphan · Accepted solution]

Hi @macamaca,

I checked and that line is shown by your uploaded image. 

So you have 2 ways to solve it:

1: Re-upload image.

2: Please go to Actions > Edit code > Assets > section-image-banner.css file and paste this at the bottom of the file:

.banner__media {
    height: calc(100% + 2px);
}

[macamaca]

2nd solution perfectly worked!! Thank you 🙂

[namphan]

Hi @macamaca,

If you have any questions, you can contact me directly.
Happy to help you 😊