Autor Zpráva
Martin.
Profil *
Dobrý den, snažím se o následující:

mám několik divů s pevnou výškou a šířkou a do každého chci umístit obrázek a to tak, aby se zobrazoval přímo uprostřed toho divu. Zkrátka, aby byl rovnoměrně odsazen ze všech stran. v CSS mi ale k obrázkům nefunguje margin:auto , googlil jsem a našel řešení - display:block a pak teprve margin:auto; všude se píše, že to frčí, mně ale pořád ne. Můžete mi někdo pomoct? Díky..
juriad
Profil
Prosím o odkaz na živou ukázku, z tvého popisu není zřejmé, co děláš špatně.
Trejpa
Profil
Martin.:
Nechápu, proč obrázku nastavovat zobrazení bloku, když se může zarovnat stejně jako text - ukázka.

Vlastnost margin nastavená na auto funguje k centrování jen ve vodorovném směru, ve svislém auto znamená nulu.
Bubák
Profil
Martin.:
všude se píše, že to frčí, mně ale pořád ne
Kromě nějaké chyby v kódu mne napadá jediný důvod, IE ve quirk režimu, až v IE11 funguje margin: auto i ve quirku.
http://kod.djpw.cz/ymmb

Pokud znáš výšku obrázku, je i vertikální centrování napříč prohlížeči jednoduché.
Pokud oželíš vertikální ventrování v IE 7, jde jednoduše centrovat tak, že DIVu krom rozměrů deklaruješ
display: table-cell; vertical-align: middle; text-align: center;

Nevím, zda je to pro tebe přijatelné, ale nejjednodušší je použít obrázek na pozadí, v ukázce je obrázek uprostřed na pozadí body:
http://kod.djpw.cz/zmmb
Martin.
Profil *
To by se z toho už jeden zbláznil...

To co napsal Trejpa je přesně to, jak to potřebuju. Co je ale pro mě záhadou je, že když dám CTRL+C toho kodu v živé ukázce a vložím to do svého kódu, tak to stejně nefunguje :D co to sakra je?! :D


Bubák:

Ano, to funguje, jenže to nejde kombinovat s marginem a floatem, což já potřebuji...
Keeehi
Profil
Martin.:
Je možné, že něco ti to přebíjí. Ve vývojářských nástrojích lze zjistit, jaká pravidla se nakonec aplikovala a kde je jejich zdroj.
Martin.
Profil *
Hodil bych Vám se náhled živé ukázky, ale v té ten kód funguje tak, jak má, umě v souboru už ne... nerozumím tomu.


Keeehi:

To jsem si taky myslel, nicméně jsem si zkusil udělat uplně novou stranku, kde je čistě jen kód od Trejpa z živé ukázky a nejde to.
Bubák
Profil
Martin.:
nicméně jsem si zkusil udělat uplně novou stranku, kde je čistě jen kód od Trejpa z živé ukázky a nejde to.
Máš CSS v externím souboru, nebo mezi <style></style>?
Pokud použiješ Trejpův kód, co všechno z CSS nefunguje? Má aspoň DIV deklarované rozměry a lightgreen pozadí?
Martin.
Profil *
Bubák:

zkoušel jsem jak <style></style>, tak i externí css soubor. Výsledek stejný. Kod z živé ukázky funguje, až na to požadované zobrazení na středu. Rozměry i barva jsou.
Trejpa
Profil
Martin.:
Ukázka nezávisí na prohlížeči nebo vykreslovacím režimu.

Napadá mě v podstatě jen pár věcí, kvůli kterým by to nefungovalo, ale vždy bude příčina ve tvém HTML nebo CSS kódu. Například proto, že jsi obrázek změnil na blok nebo ho nějakým blokem obalil. Také to nebude fungovat s plaváním a pozicováním obrázku.
Martin.
Profil *
Trejpa:

ničím to neobaluji a obrazek nepozicuji :/

jak jsem řekl, zkusil jsem to dat i do uplně čisté stránky, nic... pořád stejný výsledek.
Trejpa
Profil
Martin.:
Tak tu stránku asi budeš muset nahrát někam na web, abychom ji viděli a případně pomohli. Věštit neumíme.

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: