QR Code Component Using CSS Flexbox and HTML5

1. Should I adjust text width with padding or width property?
2. What are best practices for font size, padding and margin units? I used pixels for every property as it was my first challenge and didn't want to overwhelm myself and progress slowly.

• I found this video Are you using the right CSS units?
• Summary of video font-size: rem width: % in combination with a max-width, ch height: question yourself "do I really need to set height" if yes -> use a min-height padding/margin: rem or em, Kevin often uses em for padding of buttons media queries: em px only for little things like shadows, borders, etc. should I follow this for units?

Any feedback is welcome.