I used the majority of these in different scenarios/situations, for example:
% - I use it with the border-radius property or when I am interested to take 100%, 50%, of a container.
em - I have used it just one time; at this very moment I don't have another use case to use it but when I used it was like a font size multiplier in a CSS framework that I was building
rem - I use it all time; why? You can set the body font-size and use rem around your text elements taking the value of my body, 15px in my body = 1rem in other sections; so if you want to increment or reduce the font size of all text in your page that is using rem you can add a media query to replace it just in the body, and that's all.
vw/vh - Usually used to take exactly 100% of the viewport height in my header/hero or; when you have a lot of page sections/rows and you want to add space between these, usually in a desktop resolution you can add more but if you are using a smartphone it will be reduced automatically to be more efficient.
wmax/vmin - mmm I used these to create responsive page titles in my hero, using properly these two properties you can avoid using a media query to scale your Text title. Examples:
I used the majority of these in different scenarios/situations, for example:
% - I use it with the border-radius property or when I am interested to take 100%, 50%, of a container.
em - I have used it just one time; at this very moment I don't have another use case to use it but when I used it was like a font size multiplier in a CSS framework that I was building
rem - I use it all time; why? You can set the body font-size and use rem around your text elements taking the value of my body, 15px in my body = 1rem in other sections; so if you want to increment or reduce the font size of all text in your page that is using rem you can add a media query to replace it just in the body, and that's all.
vw/vh - Usually used to take exactly 100% of the viewport height in my header/hero or; when you have a lot of page sections/rows and you want to add space between these, usually in a desktop resolution you can add more but if you are using a smartphone it will be reduced automatically to be more efficient.
wmax/vmin - mmm I used these to create responsive page titles in my hero, using properly these two properties you can avoid using a media query to scale your Text title. Examples:
josejesus.now.sh/
josejesusochoatorres.github.io/ano...
Thanks for the extended input 🙏❤
Your welcome, it was a pleasure; you have chosen a good topic.