It seems that ionic’s css is based on px with special classes that detect which device we’re on like: .platform-ios.platform-cordova:not(.fullscreen) .has-subheader I am used to work with ‘rem’ units to be sure that everything stays responsive, I set font-size to html, boady tags and them use rem everywhere. Can you help me figure out the best practices to enforce this in ionic ? What do you usually do to keep things responsive ? Thanks

Can someone help me clarify this ? For now I don’t find ionic framework very responsive in terms of CSS components. I don’t understand, all the components sizes are in px in ionic.css. Thanks

Ionic’s css doesn’t support rem values. [image] Scaling Ionic with CSS rem units Think of it like this...you adjust one variable, now the whole entire app is thrown off. We could have used rems, ems, but we chose to stick with pixels to control of certain parts of an app and not have it messed up by changing one variable,... But. You can run a python script to convert the base styles to rem values. ionic-rem.scss

Ahh super cool ! I read the discussion, and I really like rem units. Thanks for pointing me to the right spot :slight_smile:

Best practices to use `rem` units for responsiveness in ionic

uncategorized

CityLims November 24, 2015, 4:08pm 4

Ionic’s css doesn’t support rem values.

But.
You can run a python script to convert the base styles to rem values.
ionic-rem.scss

Topic		Replies	Views
Scaling Ionic with CSS rem units tutorials	11	16080	June 8, 2020
Pixels to rem ionic-v1	3	1082	October 20, 2014
Em or rem for font-sizes in ionic ionic-v3	0	585	August 14, 2017
Which CSS unit should I use for Ionic app? ionic-v3	0	668	July 16, 2017
Styling ionic app - which units to use in css ionic-v3	0	487	February 6, 2018

Best practices to use `rem` units for responsiveness in ionic

Related topics