How can I remove extra space on desktop!

[omar_ab]

How can I remove this extra space in the product page ONLY ON DESKTOP! Website: moorekainley.com

 

[BSSCommerce-HDL · Accepted solution]

Hi @omar_ab,

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above </head> tag: 

<style>
@media screen and (min-width: 768px) {
    body.template-product.body-theme .page-container {
        margin-top: 0px !important;
    }
}
</style>

 Here is result: 

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

[BSSCommerce-HDL · Accepted solution]

Hi @omar_ab,

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above </head> tag: 

<style>
@media screen and (min-width: 768px) {
    body.template-product.body-theme .page-container {
        margin-top: 0px !important;
    }
}
</style>

 Here is result: 

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

[omar_ab]

Pasted above the head tag, it did not work for some reason.

[omar_ab]

I put it below the head tag and it worked, thank you!

[BSSCommerce-HDL]

@omar_ab, No problem. Have a good day 😍

[Eric-HAN · Accepted solution]

Hi, there

Go to your online store- select your theme- edit code. find the  main-product.liquid

find such style code and adjustmargin-top. or you could DM me to help you 

@media screen and (min-width: 768px) {
body.template-product.body-theme .page-container {
margin-top: 8px !important;
}​