Skip to main content

Need help with header dashboard in the panorama. We have global settings for all panorama’s and I want to make adjustments to the header banner. Currently it overlaps with the background and I would like for the header in the dashboard to be aligned with the main container. 

This is a screenshot of how it is currently. 

 

The CSS code that we currently have is not changing the alignment of the header banner only the background color and text color. 

Existing CSS code:

.header--microsite,
.header--dashboard {
  background-color: #000000;
  color: #fff;
  padding-top: 11px;

}

In our sandbox, the header banner is aligned which is what I would like for the production site. There is no CSS codes in the Sandbox so unable to see what CSS code was used.

Does anyone know the CSS code on how to align the header dashboard? Or if it is possible to adjust? I have tried Chat GPT with no luck.

Thanks,

Franchesca Nunez

I had a quick look at your site and the issue is that you have a CSS targeting a few areas.
Note I made no changes to your site for images below. I simply used the Inspect option in Chrome to look at what was in place.

.container {
        max-width: 100%;
        background-color: transparent;

This is causing the width to stretch out and the background colour of transparent is hiding the default colour of the sides. removing these both looks like this:


You then also have CSS to force the black background. This is the code you mention above. 

.header--microsite, .header--dashboard {
    background-color: #000000;
    color: #fff;
    padding-top: 11px;

Removing the background colour here aligns back to your sandbox image. I also reverted the code you had for header__inner

 

Your logo is also placed via CSS which is why its still Black.

Hope this helps!!

Reply


Terms & ConditionsCookie settings