[Bug] Header is not displayed correctly in Chrome with MAC

[xevimaresma]

Version

2.7.0

Reproduction link

https://demos.creative-tim.com/material-dashboard-pro-angular2/#/dashboard

Operating System

MacOS Catalina 10.15.17

Device

Mac

Browser & Version

Chrome 101.0.4951.64 (Build oficial) (x86_64)

Steps to reproduce

Enter the website https://demos.creative-tim.com/material-dashboard-pro-angular2/#/dashboard with Chrome on a MacOS and you will show the header and buttons with a lot of padding from the top

What is expected?

Showing the header at the top

What is actually happening?

It's a lot of padding from the top

---

Solution

Correct SCSS

Additional comments

[xevimaresma]

I attatch an image to show the issue:

[Patson-la]

Hello, I have the same issue with my project (use creative tim) . the bug don't appear on Firefox.

[rarestoma]

Hi @xevimaresma, @Patson-la,

Thank you for working with our products.

To fix this issue, please change the CSS and add top: 0; to the .navbar.navbar-absolute:

.navbar.navbar-absolute{
  top: 0;
}

Please let me know if it works.

Thank you, Rares

[Patson-la]

Hi @xevimaresma, @Patson-la,

Thank you for working with our products.

To fix this issue, please change the CSS and add top: 0; to the .navbar.navbar-absolute:

.navbar.navbar-absolute{
  top: 0;
}

Please let me know if it works.

Thank you, Rares

yes I add TOP:0; in "&.navbar-absolute" in src/styles/scss/core/_navbar.scss and it's Good