Počinjemo s igranjem s našim modulom za objavljivanje na blogu, petljajući se oko razmaka. Također dodamo mali obojeni kvadrat u gornjem lijevom dijelu modula, vizualni označitelj vrste sadržaja koji to jest.
Sljedeća promjena koju unosimo jest smanjiti neke vanjske praznine na užim veličinama zaslona. Na širokim zaslonima sadržaj je širok 80% (rubovi širine 10%), ali čini mi se da je bolje ići više poput 90% na manje zaslone (rubovi širine 5%).
Dodajemo mali prijelaz kada taj medijski upit pogodi, što može biti stvarno zabavan trik dizajnera. Sviđa mi se u ovom videu, ali na kraju je ovo povučeno iz dizajna. Može postati uznemiren kad je na stranici puno više sadržaja i prilično vam ometa.
Mijenjamo naš mrežni sustav tako da ima točku prekida na najmanjoj veličini. Super je jednostavno, jednostavno prestanemo lebdjeti kolonama i učinimo ih width: 100%;Yay za nepromišljene mreže! Putem se borimo s nekim specifičnim problemima.
Otvaramo pravi iOS simulator kako bismo provjerili mrežu koja radi na "pravom" mobilnom uređaju. Mučimo se s pronalaženjem odgovarajuće metaoznake, ali na kraju pronađemo ispravnu s CSS-Tricks.com. Radi! Ali naravno, imamo nekih problema s pozicioniranjem koje ćemo morati riješiti. Za zapisnik, ta metaoznaka je:
Mazimo se, petljamo, prtljamo s razmakom i dimenzioniranjem dok stvari ne izgledaju u redu. Stvari do kraja izgledaju prilično ugodno!