| Autor | Zpráva | ||
|---|---|---|---|
| byXick Profil * |
#1 · Zasláno: 9. 8. 2015, 12:10:03
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 |
#2 · Zasláno: 9. 8. 2015, 12:29:29
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 * |
#3 · Zasláno: 9. 8. 2015, 12:35:47
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 |
#4 · Zasláno: 9. 8. 2015, 12:43:44
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 * |
#5 · Zasláno: 9. 8. 2015, 13:11:04
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; |
||
| 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 vertical-align: bottom.
Bubák bol rýchlejší. |
||
| Bubák Profil |
#8 · Zasláno: 9. 8. 2015, 13:34:30
lionel messi:
„samotným obrázkom nadeklaruješ vertical-align: bottom.“ Ne. |
||
| byXick Profil * |
#9 · Zasláno: 9. 8. 2015, 13:42:10
paráda, děkuju moc :)
|
||
|
Časová prodleva: 10 let
|
|||
0