Why isn't my code moving sections to the left in Shopify?

Hi, I have added some code to product.json and products-recommendatios.liquid so I can move to the left my section but it isn’t working.

JSON and Liquid.

I’m new in shopify, appreciate any help.

hi @jr-dev

can you share store url

1 Like

Store url:

https://sn-consultng-test.myshopify.com/?_bt=eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaVJ6YmkxamIyNXpkV3gwYm1jdGRHVnpkQzV0ZVhOb2IzQnBabmt1WTI5dEJqb0dSVlE9IiwiZXhwIjoiMjAyMS0xMS0xN1QxMzoxMDo0Ni42MDdaIiwicHVyIjoicGVybWFuZW50X3Bhc3N3b3JkX2J5cGFzcyJ9fQ%3D%3D–4e8f42a513d3461c3535bcd88dbe459cb78f3b89&fts=0&key=e32a5e0f29d8ec11adb6ba71bec01ed4a5b4793638a217b515d89c494ff11257

Basically I need to do something like this

https://www.nordstrom.ca/s/benedetta-bruzziches-vitty-grande-crystal-embellished-leather-shoulder-bag/6429784?origin=category-personalizedsort&breadcrumb=Home%2FBrands%2FBenedetta%20Bruzziches&color=400 (the body section)

https://sn-consultng-test.myshopify.com/products/aged-flower and this is what I have.

Thanks!

File : section-main-product.css

@media screen and (min-width: 990px) {
  .product:not(.product--no-media):not(.featured-product) .product__media-wrapper {
    max-width: 64%;
    width: calc(64% - 1rem / 2);
  }

  .product:not(.product--no-media):not(.featured-product) .product__info-wrapper {
    padding-left: 4rem;
    max-width: 36%;
    width: calc(36% - 1rem / 2);
  }
}

Replace by

@media screen and (min-width: 990px) {
  .product:not(.product--no-media):not(.featured-product) .product__media-wrapper {
    max-width: 54%;
    width: calc(54% - 1rem / 2);
  }

  .product:not(.product--no-media):not(.featured-product) .product__info-wrapper {
    padding-left: 4rem;
    max-width: 46%;
    width: calc(46% - 1rem / 2);
  }
}
1 Like

It didn’t work.

check your new css code did not update here

Is updated, do not why it isn’t showing changes…