A lábléc kiépítésének ebben az utolsó képsorában az alsó láblécen dolgozunk, ahol a CodePen és a ShopTalk területek találhatók.
Kicsit meg kell változtatnunk a HTML-t, ahogy arra a felismerésre jutunk, hogy az alján lévő négy darabnak (logó, szöveg, logó, szöveg) logikus lenne egymásba illesztett soros blokkelemek sorozata ( vertical-align: middle;).
Belefutunk a kérdésbe, ahol az inline-block elemek között több hely van, ezért a font-size: 0; trükk ebből a cikkből.
Végül működtetjük az elrendezést, de valójában nem látja, hogy a valós képekbe esik. Ahogy a Photostarral tettük, új Photoshop fájlt is készítek ezekhez a láblécekhez. Ez csak megkönnyíti a logók kezelését és a későbbi frissítéseket. 2x méretben is elkészítem és kicsinyítem őket, így jól mutatnak a Retina kijelzőin. Bele dobom őket a nálunk lévő helyőrző képcímkékbe, és remekül működik.
Fájlok
- 74 láblábú Logos.psd.zip