Real responsive device mode

Question

You might think that changing an iframe's width to a device width acts the same way as a device emulator would, but in reality it does not. Here is a case in point: if you load pages.github.io in an iframe with a width of 320px, you'll get: <img width="359" alt="screen shot 2018-04-09 at 4 44 24 pm" src="https://user-images.githubusercontent.com/331833/38528599-4c6ef62c-3c15-11e8-97e6-6c2bf2448da5.png"> You can try it out yourself: If you go to pages.github.io and enable chrome's devtools to em...

nojacko · Accepted Answer

Build your CSS to with min-width rather than min-device-width etc... and it's all good.

tommedema · Answer

@nojacko that assumes that I have control over the CSS. That's not the case ;)

Also, the above example does not use min-device-width. It simply uses width: 900px. Small devices are smart enough to scale accordingly. A real responsive mode would therefore do the same.

artf · Answer

Thanks for the suggestion @tommedema but currently I don't see any value in start working on such improvement, the current implementation works if you want to build a responsive template and this is what really matters. BTW if you really want to work on this PRs are welcome :)

Real responsive device mode

Question

Answers (3)

Related Questions and Answers

Trying to have 'Settings' sector under the style

The documented way to parse @keyframes does not work

Doctype in the canvas iframe

Cannot set 0px box shadow blur

Paid Plugins That Match This Issue

Browse Plugin Categories