iPad Pro 12" recognized as Laptop, not tablet

Hi everyone, especially to all the developers at blocs!

I noticed a strange behaviour on my iPad 12" today:
When rescaling my website, the iPad is (probably because of its “bigger-than-usual” screen size) recognized by my responsive website as a desktop / laptop.

I can see that, because I made a special bloc which is only visible for tablets / mobile, not for Laptops or Desktops. (the first picture of my band with no parallax-effect --> because its not supported on mobile devices).

Is there any possibility, to tell my website, that this iPad is no Laptop / Desktop-Device or do I have to think outside the box?

You can test it here: https://www.supernova-live.de (still in development).

Thanks in advance for helping me!
All the best
Beni

The notion of device specific breakpoints is something to try and move away from. In Blocs we now refer to these as sizes (XL | MD | SM | XS) not devices. The break points kick in based on screen width. You can find the screen width that is target in the lower left corner of the design canvas.

3 Likes

Hey Norm, thank you for your quick reply!
Alright, I understand the concept of breakpoints.

Is there a possibility to manually adjust these sizes or are they fixed? (i haven’t found any way to change them)
If they are adjustable, I would just make the MD size a little bigger, so an iPad Pro with 12" will still be in the MD-Breakpoint size.

Not from within Blocs. I think you would have to edit the core of Bootstrap to do that, others may know of a better.

1 Like

Hi @Beni

This may head you to the right direction, see section on Grid Breakpoints. However, it makes more sense to read all from the beginning.

https://uxplanet.org/how-to-customize-bootstrap-b8078a011203

MDS

1 Like

Hey @Norm and @MDS: Thank you very much for your answer and the link. This helps me to dive further into this topic. Wonderful!
All the best
Beni

1 Like