transform: small tricks for scale and minwidth

Preface

If the text is reduced to a certain level, it cannot be reduced, that is, the fontsize is invalid, so scale is used.
The flex used in the layout will not cause rearrangement after setting the scale, leaving blank space.
Use margin-right: -0.8rem;
this will cause sliding bars to appear on the left and right of the screen.
Use min-width: 5rem; or width: 5rem; to solve the problem.

But I still don't understand why min-width can solve the slider problem.
Leave notes here.

Code

      display:flex;
      transform: scale(0.7);
      justify-content: flex-end;
      margin-right: -0.8rem;
      width: 5rem;
      min-width:5rem;

Guess you like

Origin blog.csdn.net/a519991963/article/details/102468890