Začnemo z igranjem z našim modulom za objave v spletnem dnevniku, ki se ukvarja z razmikom. V zgornjem levem kotu modula dodamo tudi majhen obarvan kvadrat, vizualni označevalec vrste vsebine, za katero gre.
Naslednja sprememba je, da zmanjšamo nekatere zunanje vrzeli pri ožjih velikostih zaslona. Na širokih zaslonih je vsebina 80% široka (robovi 10% širine), vendar je bolje, da gre bolj kot 90% na manjše zaslone (robovi 5% širine).
Dodamo majhen prehod, kdaj ta medijska poizvedba zadene, kar je lahko zelo zabaven trik pri oblikovanju. V tem videu mi je všeč, toda sčasoma se je to potegnilo iz zasnove. Lahko se razburja, ko je na strani veliko več vsebine in precej moteče.
Naš mrežni sistem spremenimo tako, da ima mejno vrednost najmanjše velikosti. To je zelo enostavno, samo ustavimo plavajoče kolone in jih naredimo width: 100%;Yay, da ne pretiravajo mrež! Na poti se spopadamo z nekaterimi specifičnimi težavami.
Odpremo pravi iOS simulator, da preverimo omrežje, ki deluje na "pravi" mobilni napravi. Nekoliko se trudimo z iskanjem ustrezne metaoznake, vendar na koncu poiščemo pravilno CSS-Tricks.com. Deluje! Seveda pa imamo nekaj težav s pozicioniranjem, ki jih bomo morali rešiti. Za zapis je ta metaoznaka:
Mi tinker tinker tinker z razmikom in velikostjo, dokler stvari ne izgledajo v redu. Stvari so do konca videti precej lepo odzivne!