Autor Zpráva
Nikola
Profil
Dobrý den, potřebovala bych poradit, jak pomocí CSS zajistím abych měla v hlavičce stránky obrázek a vedle něj text? Zároveň ale, aby obojí bylo na středu stránky.
Děkuji za rady.
Hando
Profil
Ahoj.

Vycentrování celé stránky - Vycentrování obsahu stránky

Obrázek a text - hádám, že se jedná o logo a nějakou hlavičku...
Možností je více, jedna z nejjednodušších je vytvořit <div> pro logo a druhý pro hlavičku - no a napozicovat je vedle sebe, třeba nastavením obtékání. Obtékání

Živá ukázka - pro inspiraci...
Bubák
Profil
Nikola:
Přiznám se, že z popisu mi není jednoznačně jasní, co vlastně chceš, pokud jsem se netrefil, upřesni dotaz.
Živá ukázka
Obrázek vedle nadpisu

Hando:
no a napozicovat je vedle sebe
Pozicování zejména začátečníkům přináší problémy. Krom toho je proti smyslu CSS měnit pozici, pokud se změní text, tedy samotná informace.
Nikola
Profil
Bubák:
Ano myslela jsem to přesně tak, děkuju moc mi to pomohlo.
Jen mám ted problém, že bych chtěla text zarovnat na spodní úroveň obrázku, dokážete mi poradit to udělám? Pokud chápete jak to myslím.
Živá ukázka
Bubák
Profil
Nikola:
Stačí změnit line-height (na víceřádkové texty by bylo nutné použít složitější řešení).
Vertical-align v tomto případě nefunguje, doporučuji vymazat.
V ukázce jsem dal záměrně vysokou hodnotu line-height, proto je text pod obrázkem, ale není problém zarovnat text přesně s obrázkem.
Živá ukázka
Shake It

Nakonec jsem se rozhodl pro čistší řešení (nezneužívám line-height), využil jsem toho, že v nadpisu je další element, v tomto případě odkaz:
Živá ukázka
Živá ukázka
Pokud by bylo potřeba dostat text ještě níže, stačí zvětšit height.

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: