Hey, I’ve added two custom images on my store: https://genzvibestore.com
The images are blue flames.
They align perfectly centred on mobile layout, but on desktop they align on the left and i would like the images centred on desktop. Is there any way you can help me with this issue?
Would be greatly appreciated!
@genZvibe If your using a section use the custom css setting feature of that section and try the following CSS. Don’t put in the general theme css or all sections will be effected.
https://help.shopify.com/en/manual/online-store/themes/theme-structure/extend/add-css
.image-with-text__text { display: none; }
On desktop that element is set to take up 50% width which it does even though it’s empty and has not text; because it’s sharing a "row’ in the layout with the image it gets the height that the image has.
On mobile the width for both are set to 100% so the errant text-element wraps to the next row but since it has no actual content it has zero height and collapses to nothing.
HI @genZvibe
This is Victor from PageFly - Landing Page Builder App
You can try this code by following these steps:
Step 1: Go to Online Store->Theme->Edit code.
Step 2: Search file base.css
Step 3: Paste the below code at bottom of the file → Save
.image-with-text__text-item.grid__item {
display: none !important;
}
.image-with-text.image-with-text–no-overlap.page-width.isolate.collapse-corners.section-template–18371998974265__3ad43b5a-fb7d-4cbe-adfb-c4a18bbe0b2a-padding, .image-with-text.image-with-text–no-overlap.page-width.isolate.collapse-corners.section-template–18371998974265__4fbf38b2-ec94-4a7f-ab4a-2c0083244454-padding {
max-width: 40% !important;
}
Hope that my solution works for you.
Best regards,
Victor | PageFly
Thankyou so much! It worked.
You are welcome @genZvibe 
