Autor Zpráva
byXick
Profil *
Ahoj, mám několik obrázků o různé výšce a chtěl bych je zarovnat na spodek divu (div.obrazek). Kvůli různé výšce obrázků není možné použít position: relative; top: x%. Má někdo nějaký nápad?

Tady je HTML:
<div class="prod">
<div class="obrazek">
<img src="images/kesu.png" alt="kešu oříšky" height="120" width="150">
</div>
...
</div>

Tady je css:
div.obrazek {
border-bottom: solid 1px grey;
margin-right: 5px;
margin-left: 5px;
margin-bottom: 10px;
height: 200px;
}

div.prod {
float : left;
width : 200px;
color: black;
margin-right: 2.8px;
margin-top: 27px;
}
Bubák
Profil
Koukám, že znáš výšku obrázku, tak přece není problém spočítat pro obrázek honí margin.
Čisté řešení je deklarovat div.obrazek jako buňku tabulky a obsahu buňky deklarovat vertical-align.
byXick
Profil *
jak jsem psal: není to pouze jeden obrázek - opravdu nebudu pro každý obrázek psát margin
obrázek do tabulky dám nemůžu
lionel messi
Profil
byXick:
obrázek do tabulky dám nemůžu

Nemusí to predsa byť tabulka dám, keď žiadne dámy nie sú k dispozícii, môže ísť o štandardnú tabuľku. :-)
byXick
Profil *
to "dám" je překlep, mělo tam být "dát"
tyto stránky jsou závěrečná práce do kurzu a kontrolující nechce, aby byly obrázky v tabulce
Bubák
Profil
byXick:
kontrolující nechce, aby byly obrázky v tabulce
Dyk tam žadnou tabulku nemam.

display: table-cell;
vertical-align: bottom;
http://kod.djpw.cz/ewob
lionel messi
Profil
byXick:
to "dám" je překlep, mělo tam být "dát"

Tá sekvencia znakov „:-)“ je smajlík, spisovne emotikon, vyjadruje úsmev, fakt, že príspevok bol myslený ako neškodný vtip.

tyto stránky jsou závěrečná práce do kurzu a kontrolující nechce, aby byly obrázky v tabulce

Oni ale v tabuľke nebudú, len sa budú tak tváriť a skúšajúci bude spokojný, pretože tabuľkové elementy nikde nebudú. Prvok div.obrazek bude stále rovnaký div ako predtým, len mu v CSS nastavíš display: table-cell a samotným obrázkom nadeklaruješ pardon, stále sa bavíme o div.obrazek vertical-align: bottom.

Bubák bol rýchlejší.
Bubák
Profil
lionel messi:
samotným obrázkom nadeklaruješ vertical-align: bottom.
Ne.
byXick
Profil *
paráda, děkuju moc :)

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

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