Stránka 1 z 1
pomoc s css - centrování obrázků
Napsal: pon 27. bře 2006, 22:39
od shadow
Pro svůj blog používám následující část kódu css:
Kód: Vybrat vše
* Begin Images */
p img {
padding: 0;
max-width: 100%;
}
.alignright {
float: right;
}
.alignleft {
float: left;
}
img.centered {
display: block;
margin-left: auto;
margin-right: auto;
}
img.alignright, img[align="right"] {
padding: 0px;
margin: 3px 3px 1px 10px;
display: inline;
}
img.alignleft, img[align="left"] {
padding: 0px;
margin: 3px 10px 1px 3px;
display: inline;
}
/* End Images */
Align left a align right obrázků mi funguje, ale potřeboval bych obrázek zobrazit i horizontálně ve středu, tj. vycentrovat ho. Nějak mi to nefunguje. Nevíte jak to udělat? Prostě text nad obrázkem a pak pod obrázkem, a obrazek mezitím ve středu screenu.
Re: pomoc s css - centrování obrázků
Napsal: sob 1. dub 2006, 09:29
od N@$ty
pouzij
aspomn me to tak fungovalo.
Napsal: sob 1. dub 2006, 09:32
od zombux
Napsal: ned 2. dub 2006, 10:35
od shadow
Mně jde o horizontální centrování.
To jest levý okraj stránky.........................střed stránky=obrázek.................. pravý okraj stránky.
Já na to nakonec přijdu, kde je zakopanej pes, chce to jen čas
.
A vzhledem k tomu, že ho zase tak moc nemám, tak pokud by mi někdo napsal, jak mám změnit margin (definující v tomto případě mezery mezi obrázky a obtékajícím textem), aby ho pobral i Internet Explorer, tak bych byl vděčný
.
Napsal: ned 2. dub 2006, 11:07
od zombux
řešení horizontálního centrování:
1) nastav objektu margin na auto (konkrétně levej a pravej, jak to napíšeš je věc druhá, způsobů je víc) - tohle zajistí automatický vycentrování v rámci nadřazenýho bloku v mozille/opeře/jakýmkoliv dalším prohlížeči kromě IE
2) kvůli IE nastav text-align na center u nadřazenýho bloku.
hádám že se jedná o img.centered, ten nech nastavenej přesně tak jak je a jeho nadřazenýmu bloku nastav text-align na center.
btw to čemu říkáš alignleft a alignright je ve skutečnosti float model, čili ten blok plave vlevo nebo vpravo a ostatní bloky obtékají kolem něj tam kde je místo.
Napsal: ned 2. dub 2006, 13:43
od shadow
zombux: thx za podněty a rady.
S vlastním centerování obrázků jsem si už poradil. Sice to vyžaduje ruční úpravu HTML kódu, takže to není ideální řešení, ale zase to nepoužívám tak často, aby mě to nějak obtěžovalo
.
Kód: Vybrat vše
<div style="text-align: center">
<img alt="xxxxxxxxx.jpg" id="image40" title="xxxxxxxx.jpg" src="http://www.shadowblog.cz/.............jpg" />
</div>
takže teď už zbývá jen nefunkční margin v Internet Exploreru.
Napsal: ned 2. dub 2006, 20:59
od shadow
Problém vyřešen:
http://wordpress.org/support/topic/6743 ... ost-356762
Ale bez Wysiwyg editoru. No, jo, ale co nadělám, když Internet Exploder nevezme složitější CSS kód.
Všichni FF nebo OP nepoužívají
.
Další důkaz, jak je IE debilní oproti FF nebo Opeře: Pokud dám zobrazit obrázek širší, než jak je nastavený styl pro "content", tj. pro "obsahové pole", tak IE ho samozřejmě zobrazí celý, vůbec ho nefitne a obrázek jde až do sidebaru. Pro účely IE musím nastavit natvrdo v img tagu vlastnost "width" na šířku obsahového pole.
Zatímco Opera a Firefox to samy o sobě fitnou, udělají to tedy za Vás. Inteligentní prohlížeče
.