Place product page content in the center only desktop -Brooklyn theme

Store Design
1

Hey,

  1. I would like to know how to place the product page’s content in the middle only on desktop.

  2. How can I increase the left margin in collection page on mobile only?

  3. How can I decrease the margin between product image and logo on product page?

2 Likes
2

@Pam9

Sorry you are facing this issue, it would be my pleasure to help you.

Please share your site URL,
I will check out the issue and provide you a solution here.

1 Like
3

@Pam9
Hi,
Welcome to the Shopify Community.
We are always happy to help you.
Sir, Kindly Share your Store URL.

Thank you.

4

Hey @KetanKumar ,

thank you for the willingness to help!

1 Like
5

Hey @Zworthkey ,

thank you for the reply.

1 Like
6

I have figured out the 2 and 3 so you can help me with number 1.

7

@Pam9

yes please try this code

  1. Go to Online Store->Theme->Edit code
  2. Asset->/timber.scss.liquid->paste below code at the bottom of the file.
.product-single {
display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
body.template-product .main-content {
    padding-top: 0px;
}
@media screen and (max-width: 590px) {
#CollectionSection {
    padding: 0px 15px;
}
}
1 Like
8

Wow! It worked! Thank you so much. I appreciate it.

In case I want to decrease the size of the product description table, would it still be in the middle?

1 Like
9

@Pam9

yes please try this global code work as well

1 Like
10

Thank you so much @KetanKumar !

1 Like
11

@Pam9

its my pleasure to help us

1 Like