Remove margins/padding from header

[Clairebauthor]

Hi!
I’m updating my website with a new header and there’s white spacing to the right and left of the logo. I’d like to remove the spacing so that it sits flush with the background image. Can you tell me how to do this? I’ve tried playing with the Customised layout and design but nothing seems to work. My website is https://www.claireboston.com
Thanks for your help.
Kind regards
Claire

[basanta]

Hi There,

Thanks for writing in!

This is due to the site max width and width set in the theme option -> Layout.
to fix the issue please add this CSS to your Theme Option -> CSS and let us know if that works.

.x-logobar-inner .x-container.width {
width: 100% !important;
max-width: 100% !important;
}

Hope this helps!

If you would like to learn CSS, I am sharing few resources that you take a look to get started with CSS and an interesting tool that you can use to speed up the development process.

I recommend you to watch following video that will help you to get started with CSS.

https://www.youtube.com/watch?v=MFR4WXiLzpc

Sometimes it can get a bit difficult to find out the right selector to be able to write the required CSS codes. A handy tool that can help you in this is Google Chrome dev tools. I am sharing the resource that you can refer to get started with dev tools.

https://developers.google.com/web/tools/chrome-devtools/css/

https://developers.google.com/web/tools/chrome-devtools/

https://www.youtube.com/watch?v=tP_kXBJWPhQ&t=200s

Thanks.