Mobile slideshow image error text

[Bugbuzz456]

There is an issue where my slideshow banner image showing an error only on mobile and here is the coding that i have done.

If any of you guys out there knows how to fix this issue do let me know.

[Shadab_dev]

This test is probably showing if you haven't wrapped the styles within the style tag

[Bugbuzz456]

Hi thx for the reply, do u know how to solve this 

[Shadab_dev]

Yeah, I kind of love to find bugs and would definitely love to give a try

[Bugbuzz456]

Hi thx for the help, If u want to access my store here is the link www.thriftlepak.com

[Shadab_dev]

This is what's causing the issue

Inside every slider there is this css styling code for mobile which id displayed as normal text. If you can just wrap this between style tags this would go.

<style>

your css code

</style>

[Bugbuzz456]

Ok so how do i wrap the text since i am a beginner at this.

[Shadab_dev]

In that case I will need collaborator access to your store to edit code for you.

[Bugbuzz456]

Hi this is the code for the colloborator access 7204. 

Thank you.

[Shadab_dev]

need the store url as well

[Bugbuzz456]

 This is the store URL

https://thriftlepak.com/

[Shadab_dev]

request sent

[Bugbuzz456]

I have accepted your request

[Shadab_dev]

will update you when done

[Bugbuzz456]

Sure thx so much !

[Shadab_dev · Accepted solution]

Man this took more time than expecting. Actually the issue was also something out of the box. I thought there was something in the code in between but the code was ok i didn't have anything in between don't know from where that content was getting added. 

I am able to remove that with javascript though but it first shows and when the page loads it is removed

[Bugbuzz456]

Hi i just checked the page it seems like it has been removed 

Thank you so much.

[Bugbuzz456]

Hi btw is there a way where i can upload a new image to fit inside the slideshow since when i changed the image it reflects the same error as well

[Shadab_dev]

Can you share screenshots or something for better' understanding. I don't get the issue here.

[Bugbuzz456]

Hi this is the screenshot for the image where the image has been resized and it shows the same error so i am not quite sure is it becuz of the sizing image or other factors.

[Shadab_dev]

Is it showing on the preview as well?? So when you as a user view the site

[Bugbuzz456]

HI it seems like is ok where i checked in preview mode there is no error for the image just wandering like why the size got cut off so much for the image 

[Shadab_dev]

Your images were like that before I added any code. I mean you can see the first screenshot you sent me.

[Bugbuzz456]

I see is there a way where i can fix the image sizing 

[Shadab_dev]

Like how do you want it. Do you need it to be more in length or height. 

[Bugbuzz456]

Hi this is the screenshot for the mobile where i think is the height of the image since there are still gaps in the image for both banner and slideshow.

[Shadab_dev]

I am so sorry about this my friend, but i am honestly not getting the point here. please mind my understanding. What gaps are we talking about? if you are talking about dark brown gaps above and below they are from padding and margins on sections

[Bugbuzz456]

So i just need to adjust those margins and paddings so it would fixed the image issue 

[Shadab_dev]

if i got it right, then that is not an image issue its just spacing in the sections be it the featured collection one or sections above or below it. You could play around with those and remove the paddings and margins.

[Bugbuzz456]

Alrite let me try it out thx

[Bugbuzz456]

Hi, i have tried removing the margins and paddings it seems that there are still some parts that has the gaps

[Shadab_dev]

I get that man, sometimes these spacings are added by default as well for a better look. No worries i will see to it and remove them altogether 

[Bugbuzz456]

Alrite thx and do update me once done.

[Shadab_dev]

I have removed the spacings for mobile devices

[Bugbuzz456]

Alrite i will check it out thx.

[Bugbuzz456]

Hi  i just checked it looks great without the margin and paddings !

[Shadab_dev]

Great that you like it🙂

[Bugbuzz456]

Btw is there a way for this where the image display for mobile got cut off despite selecting adapting the first image section. I asked the shopify CS and they told me need coding for this. 
 

[Shadab_dev]

Please share the screenshot of how it is on mobile now

[Bugbuzz456]

This is how it looks like now on mobile and those linings do they restrict my image size where it couldn’t show properly?

[Shadab_dev]

It could be because the background-size property of image could be set to contain, so that entire image is visible but it reduces other aspects of the image.

[Bugbuzz456]

I see, is there a way to make it fit the image or just adjusting the height to fit the whole image into the slideshow.

[Shadab_dev]

Yeah, most probably it will just need css

[Bugbuzz456]

Can u help me to do it since i am not expert in it. 

[Shadab_dev]

Will see to it.

[Bugbuzz456]

Thank you!

[Bugbuzz456]

Hi, if there is any update do let me know thx!

[Shadab_dev]

Are you doing any changes on the site now??

[Bugbuzz456]

Nope not doing any changes on the site 

[Shadab_dev]

Man i am done. I have done the best i can, looks good.