Alustame oma ajaveebipostimooduliga mängimisest, vahedega ringi askeldades. Lisame ka mooduli vasakus ülanurgas oleva väikese värvilise ruudu, mis on sisutüübi visuaalne tähis.
Järgmine muudatus on vähendada väiksemaid ekraanisuurusi. Laiadel ekraanidel on sisu 80% lai (servad 10% laiused), kuid parem on minna väiksematele ekraanidele (5% laiustele servadele) rohkem nagu 90%.
Lisame väikese ülemineku, kui see meediumipäring tabab, mis võib olla tõeliselt lõbus disainer-trikk. Mulle meeldib see video, kuid lõpuks tõmmati see kujundusest välja. See võib muutuda kohmakaks, kui lehel on palju rohkem sisu ja see häirib tähelepanu.
Muudame oma võrgusüsteemi nii, et murdepunkt oleks kõige väiksem. See on width: 100%;ülilihtne , me lihtsalt lõpetame veergude hõljumise ja muudame need Yay-ks, kuna võrgud pole üle mõelnud! Võitleme teel spetsiifiliste probleemidega.
Avame reaalse iOS-i simulaatori, et kontrollida "päris" mobiilseadmes töötavat võrku. Ma näeme natuke vaeva õige metasildi leidmisega, kuid läheme lõpuks õigest CSS-Tricks.com lehelt. See töötab! Kuid muidugi on meil mõned positsioneerimisprobleemid, mida peame välja töötama. Kirje jaoks on see metasilt:
Meisterdame meisterdamist vahe ja suuruse järgi, kuni asjad näivad korras. Asjad näevad lõpuks üsna kenasti reageerivad välja!