Hello all-
I’ve been working with a business partner to finalize his Shopify storefront, but after becoming quite satisfied with the layout of the design on phone and desktop sizes, it has come to my attention that the tablet version is not rendered correctly. I have tried it across browsers and OS’s and the only ones actually not working are tablet versions. I am assuming it’s due to some width/max-width settings, or lack thereof. If anyone could help with this it’d be greatly appreciated as Shopify support has not been able to address it yet. Thank you 
EDIT: This uses the “Refresh” theme, which seems to have issues on tablets even in a vanilla/unaltered state.
Hi @ayowell ,
This issues is persistent with videos and images since the images have to fit perfectly to every screen size. You need to have a different set of code to adjust it according to screen size.
Thanks for your reply. I do know it’ll take some appropriate media-query stuff, but I don’t have enough insight into this to figure out which doe needs to go in which lines in which files. I’d have hoped that since this was a theme offered by Shopify that there support would be a bit more helpful on this issue, since this seems like an issue with the “Refresh” theme itself.
Yes, since images being use can be different in every store, there is no way to detect the sizes yet using a code and to render it appropriately. The images will be stretched or cut off depending on screen size. What you can do is, you can show different section with different images depending on the screen size. You can try the youtube tutorial here
