Aby ste nemuseli na monitore riešiť rozlíšenie kvôli testu responzivity tak si to tu môžete skúšobne naklikať:
Aktívny stav je oranžový. Samozrejme na mobile nenasimulujete PC... Ani tablet. Ani na tablete PC, vždy sa dá ísť iba do nižšieho rozlíšenia ako je aktuálne rozlíšenie obrazovky.
Prečo táto stránka vznikla?
Potreboval som si v praxi vyskúšať ako funguje grid čo sa týka tvorby základnej plne responzívnej stránky, a aj čo sa týka pozíciovania obsahu v blokoch (v mriežkach). Tak som si vytvoril túto stránku a dal do nej dajaký obsah aby sa to dalo skúšať...
Pre tri rôzne rozlíšenia máme tri rôzne mriežky. A pre zaujímavosť - mriežky riešim iba čo sa týka stĺpcov - majú definované fr - pomery fragmentov - pre každé rozlíšenie iné. Riadky neriešim, to sa "prispôsobí samo", je tu iba príkaz grid-auto-rows: auto; ten to všetko "zariadi" aby to fungovalo... A ako vidno funguje to dobre a jednoducho... Občas je nastavená pozícia pre obsah v daktorom bloku (napríklad pozícia loga sa mení podľa rozlíšenia).