V tomto poslednom vysielaní vytvárania päty pracujeme na spodnej päte, kde sú oblasti CodePen a ShopTalk.
Musíme trochu zmeniť HTML, keď si uvedomíme, že štyri bloky pozdĺž spodnej časti (logo, text, logo, text) by mali mať zmysel byť radom vložených blokových prvkov, ktoré sú sústredené jeden na druhého ( vertical-align: middle;
).
Narazili sme na problém, kde je medzi prvkami vloženého bloku priestor navyše, takže použijeme veľkosť písma: 0; trik z tohto článku.
Rozloženie nakoniec funguje, ale vy ma vlastne nevidíte, ako padám do reálnych obrázkov. Rovnako ako v prípade Photostar, aj pre tieto logá päty vytváram nový súbor Photoshopu. Toto iba uľahčuje prácu s týmito logami a uľahčuje ich budúcu aktualizáciu. Vyrábam ich tiež dvakrát väčšie a zmenšujem ich tak, aby vyzerali dobre na displejoch Retina. Pustím ich do značiek zástupných obrázkov, ktoré máme, a funguje to skvele.
Súbory
- 74-päta Logos.psd.zip