Re: Aligning a custom liquid image to the left

Solved

Aligning a custom liquid image to the left

LiamP191
Shopify Partner
25 1 4

My store is: https://gigachew.com.au/products/giga-chew-mastic-gum

 

In my product page I've added a sizing image using custom liquid but I can't seem to get the image to align to the left

 

The code for my custom liquid is: <img style="display: block; margin-left: auto; margin-right: auto;width: 110% " src=https://cdn.shopify.com/s/files/1/0806/8320/4902/files/Save_3000_x_427_px_3.png?v=1696312316>

 

I've attached an image of what I mean, it looks wonky at the moment.

LiamP191_0-1696312814192.png

 

Accepted Solutions (2)

Sheesh_b
Shopify Partner
514 113 117

This is an accepted solution.

Hi @LiamP191 

You can try below code

<img style="display: block; margin-left: -45px; margin-right: auto;width: 110% " src="https://cdn.shopify.com/s/files/1/0806/8320/4902/files/Save_3000_x_427_px_3.png?v=1696312316">

 but I would rather not suggest to do. Your image have some space in the left and if you remove that, it'll align automatically.

Sheesh_b_0-1696315116331.png

Thanks

Sheesh B

We're here to simplify website creation for those looking to establish a strong online presence. Book a meeting slot if you want to discuss. It's FREE. BOOK NOW | Try Shopify for $1 for 3 Months: Shopify Trial | Shopify Web Store Developer |
LIKE or mark as ACCEPTED SOLUTION

View solution in original post

syedsumaimaly
Trailblazer
147 16 21

This is an accepted solution.

Hi @LiamP191 

You can try this code.

<img style="display: block; margin-left: -10%; margin-right: auto;width: 100% " src=https://cdn.shopify.com/s/files/1/0806/8320/4902/files/Save_3000_x_427_px_3.png?v=1696312316>

RESULT:

syedsumaimaly_0-1696315321962.png

If I managed to help you then, don't forget to Like it and Mark it as Solutions.

 

View solution in original post

Replies 2 (2)

Sheesh_b
Shopify Partner
514 113 117

This is an accepted solution.

Hi @LiamP191 

You can try below code

<img style="display: block; margin-left: -45px; margin-right: auto;width: 110% " src="https://cdn.shopify.com/s/files/1/0806/8320/4902/files/Save_3000_x_427_px_3.png?v=1696312316">

 but I would rather not suggest to do. Your image have some space in the left and if you remove that, it'll align automatically.

Sheesh_b_0-1696315116331.png

Thanks

Sheesh B

We're here to simplify website creation for those looking to establish a strong online presence. Book a meeting slot if you want to discuss. It's FREE. BOOK NOW | Try Shopify for $1 for 3 Months: Shopify Trial | Shopify Web Store Developer |
LIKE or mark as ACCEPTED SOLUTION

syedsumaimaly
Trailblazer
147 16 21

This is an accepted solution.

Hi @LiamP191 

You can try this code.

<img style="display: block; margin-left: -10%; margin-right: auto;width: 100% " src=https://cdn.shopify.com/s/files/1/0806/8320/4902/files/Save_3000_x_427_px_3.png?v=1696312316>

RESULT:

syedsumaimaly_0-1696315321962.png

If I managed to help you then, don't forget to Like it and Mark it as Solutions.