Increase Header And Product Page Width - DAWN Theme

[ManuelH]

hey guys, does anybody know how to increase the header and product page width. everything should stay the same size and not change in scale, only move further apart towards the edge.

An example how I would like it approx is this: 

Much apprech

[Anshul_arora]

Hello @ManuelH ,

To adjust the Header section as per the reference images, please use the mentioned CSS code.

Add the code at the bottom of theme.liquid file before </body> tag and save.

<style>
header.header.header--middle-center.header--mobile-center.page-width.header--has-menu {
max-width: 100% !important;
}
</style>

After applying code output will be like this -: https://prnt.sc/fl9W-85WhK1H

I hope the code helps you.

Please share if you have any queries.

Thank you.

[Made4uo-Ribe]

Hi @ManuelH 

Check this one. 

From your Shopify admin dashboard, click on "Online Store" and then "Themes".

Find the theme that you want to edit and click on "Actions" and then "Edit code".

In the "Assets" folder, click on "base.css, style.css or theme.css" file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

.header:not(.drawer-menu).page-width {
    max-width: 100%;
}
.section-template--21651094733124__main-padding .page-width {
    max-width: 100%;
}

And save. 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

[ManuelH]

Thanks for helping that worked great, it just that the gap between image and selectors is too big now. Also do you think you could help redesign the selector buttons and make the add to cart button align with the rest of the content on the right as well as put the thumbnails to the left vertically aligned? 

Here's an example of what I'd like it to look:

No hard feelings if you dont want to do it but i'd certainly be very thankful;)