Problem with CSS in Firefox

Asked

Viewed 346 times

1

Hello, I’m with a project in Angular (2 and 4) and Materialize + Angular Material. The problem is, I can’t apply the CSS property zoom. Where in Chrome everything is ok but in Firefox it does not have this property. What alternative can I use in this case?

In Firefox is like this:

inserir a descrição da imagem aqui

Chrome gets the same bug though, if I zoom in at 80%, it adjusts:

inserir a descrição da imagem aqui

Example of CSS code used to adjust in Chrome:

@media only screen and (max-width: 1366px) {
  html {
    zoom: 80%;
  }
}

I tried to use ***Transform: Scale* but did not resolve (gave margin in the 4 corners), see:**

inserir a descrição da imagem aqui

  • Guy in this case I suggest you put the HTML/CSS code related to this problem. Clean up the files and put here only the code of this bar that is bugging. Because it is difficult to give you an accurate answer like this. Have I noticed that you want to decrease the entire HTML just to adjust the margin is this? If it is this is very wrong can give you serious responsiveness problems in the future. If possible post the code as I said

  • 1

    Hello, all right? So I was able to resolve with@media but using it inside "@Supports (display: flex)". Thank you very much!

  • Good, you did it right with @Upports! Kind of weird this bug but good that solved. You can post a more complete answer to your own question and then mark it as accepted. So this question is not open in the system even though it has already been solved!

No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.