Hello,
I have a banner that I want to set up as a header and I want it to have full width, without the left & right margins/paddings. I tried to overwrite the ThemeGrid_Container CSS but that will change it for every container in the page, I only want it for this one banner.
I attached an example of how I want the banner to look.
Thank you!
Hi Michael Devaux ,Try to apply the below CSS at theme level like I did in below image:.header .ThemeGrid_Container { padding: 0px; max-width: 100%; margin: 0px;}
Or If you want to add banner(Image) on header use the below CSS:
Just change the Image URL..header .ThemeGrid_Container { background-image: url("../img/OrderManagement.Banner.jpg?AmQ53czO_N+9gPzowYrQ7A"); max-width: 100%;}
RegardsKrishnanand Pathak
Hi Michael,
Can you formulate an OML with an example of what you need, so I can get a clear picture of the banner and the place where you want to use it?
Best Regards
To have full width without margins you can try to setting up the max width of your theme grid settings to a bigger number of pixels that you have, and then adjust your banner width to ''fill'
hope it helps
Kind regards,
Sergio
Hey, thank you for answering, but if I do that it will inpact all the other containers as well.
Hey, so you can apply this css to your layout block style sheet
Hi Michael Devaux, just add the below CSS to your module's theme (or on screen's CSS in case you want it on a particular screen),
.header {
background-image: your image reference;
}
@Michael Devaux Are you still looking for the solution?