The first row of images on every one of the product pages on mobile is misaligned for some reason and I was wondering if there was a way to fix it. Since only the mobile is affected, I want a solution that doesn’t require adjusting the desktop. I’m using the Dawn theme.
Thanks so much in advanced!
https://piecesofporcelain.store/products/the-sweet-escape-panty
Hi @pop12345 ,
Step 1: Go to Admin → Online store → Theme > Edit code:
Step 2: Search for the file base.css. And add this code snippet to the end of the file.
@media screen and (max-width: 749px) {
.grid--peek.slider .grid__item:first-of-type {
margin-left: 0px!important;
}
}
Step 3: Save and reload home page.
=>> The result:
I hope these instructions will help you. If they are helpful, please give us likes and mark as the solution.
Have a nice day sir!
Thanks so much! The preview looked great but when I saved it, it began to display the following message in my header: Liquid error (layout/theme line 42): internal. The mobile site also began to crash.
After removing the code, the error message is still present though the mobile site is functional.
These are lines 42-48 in my theme.liquid file:
{{ content_for_header }}
{%- liquid
assign body_font_bold = settings.type_body_font | font_modify: ‘weight’, ‘bold’
assign body_font_italic = settings.type_body_font | font_modify: ‘style’, ‘italic’
assign body_font_bold_italic = body_font_bold | font_modify: ‘style’, ‘italic’
%}
@pop12345 , All stores are experiencing this problem. It’s not caused by my code and should be fixed in the next few minutes.
Amazing, thanks so much for letting me know!
Looks great now, I appreciate your help!
Yeah you can follow this post, other people are also experiencing the same situation as you https://community.shopify.com/c/shopify-design/liquid-error-layout-theme-line-28-internal-error-on-top-of-every/m-p/2727817
