Font size too small on iPad mini (looks fine on laptop and phone)

Hi everyone,

I’m experiencing a display issue with my Glide app.

The font sizes look perfect on my laptop and my iPhone. However, on an iPad mini, the text appears significantly smaller and harder to read

I used a CSS which increase the font, but it apply on all the device (laptop, phone)

How can I do my CSS in order to apply only on small tablet (iPad mini..,)

Any advice or best practice would be greatly appreciated.

Thank you!

1 Like

You might have used something very broad like:

html, body {
  font-size: 18px;
}

You can cater in some media query so it only applies to your iPad mini.

@media only screen and (min-width: 600px) and (max-width: 900px) and (orientation: portrait) {
  html, body {
    font-size: 18px;
  }
}

@media only screen and (min-width: 600px) and (max-width: 900px) and (orientation: landscape) {
  html, body {
    font-size: 17px;
  }
}
2 Likes

Hi
It work!
Thanks a lot for you help :wink: