search

eduardoboucas / include-media

📐 Simple, elegant and maintainable media queries in Sass
https://eduardoboucas.github.io/include-media/
MIT License
2.57k stars 191 forks source link

Change em's unit interval from 0.1 to 0.0625. This is because some de… #193

Open diegopelaezie opened 4 years ago

diegopelaezie commented 4 years ago

Some devices like old iPads and iPad mini don't validate the breakpoints in ems correctly.

Hi guys,

I found this issue in a current project so I overwrote the $unit-intervals variable in my project. But I feel this might be something you guys will want to look at and maybe update.

When using pixels a '>tablet' is compiled as '>769px'.

In ems, (768 / 16 = 48em) '>tablet' is complied as '>48.01em'. But 48.01em in pixels is 768.16px and not 769px. This is having in mind the default browser font size of 16px and html of 62.5% (10px).

The right value in ems should be '>48.0625em' which then converts to the expected value. This applies to any other em value so the interval should be 0.0625.

Any thoughts?

robsonsobral commented 4 years ago

The title is wrong. It doesn't make sense. It should be "0.01 to 0.0625".