cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 

Weird AppHeader on chrome

Auriane
Visitor

Hello,

Since a few weeks, the appHeader of my app is weird on chrome. I use the navItem

How it is on Firefox

Auriane_0-1737974101167.png 

and Chrome :

Auriane_1-1737974154866.png

Auriane_2-1737974172879.png

If I click on the invisible button next to the menu, the page refresh and come back to normal

Does anyone know where it comes from or how to fix it ?

 

4 REPLIES 4

imsingh
Dynatrace Advisor
Dynatrace Advisor

Hi Auriane

Can you share a sample code snippet so we can try to replicate?

Thanks

Indermohan Singh

Here is the code :

<AppHeader>
<AppHeader.NavItems>
<AppHeader.AppNavLink appName="" href="/Home">
<AppHeader.AppIcon src="./assets/Microsoft_Office_Teams_Logo_256px.png" />
</AppHeader.AppNavLink>
<AppHeader.NavItem as={NavLink} to="/Home" ref={setHomeRef}>Home</AppHeader.NavItem>
<AppHeader.NavItem as={NavLink} to="/Subnet" ref={setSubnetRef}>Site overview</AppHeader.NavItem>
<AppHeader.NavItem as={NavLink} to="/TeamsHome" ref={setCallRef}>Call diagnostic</AppHeader.NavItem>

<AppHeader.NavItem as={NavLink} to="/Issues" ref={setIssueRef}>
Microsoft Issues
</AppHeader.NavItem>

<AppHeader.NavItem as={NavLink} to="/Install_Config" ref={setInstallRef}>Configuration</AppHeader.NavItem>
</AppHeader.NavItems>
</AppHeader>

 

imsingh
Dynatrace Advisor
Dynatrace Advisor

Hi Auriane

Thanks for the code snippet. I tried with the latest Strato and I can't replicate your issue. Can you also tell me the screen width and also version numbers of Strato packages? 

Thanks again

 

I found the problem ! Thank you for your answer, it put me on the right track

It was a dumb mistake : the appHeader was in a <Flex> with the help menu and this caused the appHeader to have a small space allocated and have a weird display.

 

 

Featured Posts