Product page photo and header overlap

Hi,

Can you please help with product page below

I want to expand and make the product page photo bigger and I want to overlap the header with product block

website: afterhour-6053.myshopify.com

Please let me know,

Could use something like margin-top/margin-bottom, padding etc in the custom CSS, but to move all those elements probably need a developer to adjust the theme file code. Can try this in the product description section of your theme. Can try this or other css:
https://www.w3schools.com/Css/css_margin.asp

Customize Theme>Product Template>Select Product Description Section>Custom CSS

Maybe someone else can provide some code to help. Good luck!

ok, thanks for the feedback.

I was hoping someone would give me a trick :disappointed_face:

Really the whole page probably should just be redesigned using code in the theme files. but you can add something like

{margin-top: 50px;}
OR
{margin-bottom: 50px;}

May need to do the same replacing “margin” with “padding” as well in addition to above. You would apply this in the custom CSS section of the header and product information sections after navigating to “default product template”.
(customize theme>products>default template>edit>save)

It is too many elements to provide the exact code for me personally, but Shopify will suggest them as you type, when you hit the space bar or input a single period “.”

For example to adjust the header hamburger icon element you would add something like this:

.header__icon–menu {margin-top: 50px; padding-bottom: 10px;}

Then proceed to do the same to all other page elements you have marked, and click save. Good luck!