V tomto posledním screencastu sestavování zápatí pracujeme na spodním zápatí, kde jsou oblasti CodePen a ShopTalk.
Musíme trochu změnit HTML, když jsme si uvědomili, že čtyři bloky podél spodní části (logo, text, logo, text) by dávaly smysl být řadou vložených blokových prvků, které jsou soustředěny na sebe ( vertical-align: middle;).
Narazili jsme na problém, kde je mezi vloženými blokovými prvky prostor navíc, takže použijeme font-size: 0; trik z tohoto článku.
Nakonec dostaneme rozložení, ale ve skutečnosti mě nevidíš, jak padám do skutečných obrazů. Stejně jako u Photostar jsem vytvořil nový soubor Photoshopu jen pro tato loga zápatí. Díky tomu je snazší jednat a budoucí aktualizace těchto log jsou snazší. Vyrábím je také dvakrát větší a zmenšuji je tak, aby vypadaly dobře na displejích Retina. Umístím je do značek zástupných obrázků, které máme, a funguje to skvěle.
Soubory
- Loga 74 zápatí.psd.zip