Autor | Zpráva | ||
---|---|---|---|
xmark Profil |
#1 · Zasláno: 23. 3. 2013, 16:37:01
Mám <li>, v něm je <a>, v něm chci mít nalevo obrázek, u kterého je daná šířka a vpravo vedle obrázku je text. Chtěl bych, aby <li> byl po celé ploše klikací. Nebýt toho obrázku, nastavím tomu <a> stejnou výšku jako <li>, což je myslím klasické řešení. Teď jsem ale v situaci, že ten obrázek má proměnlivou výšku, takže mám problém.
Když je obrázek vyšší než <a>, tak vyčuhuje z <li>. Má to nějaké jiné řešení, než uchovávat výšku obrázku a nastavovat podle ní výšku <a> a <li>? Děkuju za radu. |
||
margin Profil * |
#2 · Zasláno: 23. 3. 2013, 16:53:42
Pokud to správně chápu, tak nenastavuj výšku ani obrázku, ani odkazu, výška se přizpůsobí podle obsahu, ve tvém případě podle výšky obrázku.
|
||
xmark Profil |
#3 · Zasláno: 23. 3. 2013, 16:56:05
Když to tak udělám, nebude klikací celá plocha <li>.
|
||
margin Profil * |
#4 · Zasláno: 23. 3. 2013, 17:10:32
xmark:
„Chtěl bych, aby <li> byl po celé ploše klikací. Nebýt toho obrázku, nastavím tomu <a> stejnou výšku jako <li>, což je myslím klasické řešení.“ Já s tím nemám problém. CSS kód tvého klasického řešení pro <li> a <a> vypadá jak? |
||
xmark Profil |
#5 · Zasláno: 23. 3. 2013, 17:20:25
.categories_list { margin: 0; padding: 0; list-style: none; } .categories_list li { margin: 0; padding: 0; margin-bottom: 10px; border:1px dotted #7C0D0B; background: #EFEAC9; min-height: 55px; } .categories_list li a { min-height: 55px; display: block; text-align: center; text-decoration:none; } <li> <a href='#'> <img src='p9120052.jpg'> Jméno </a> </li> |
||
margin Profil * |
#6 · Zasláno: 23. 3. 2013, 17:51:48
|
||
xmark Profil |
#7 · Zasláno: 23. 3. 2013, 19:15:37
Tak jo, to vypadá dobře. Poslední detail.. nedalo by se v tom zařídit, aby se ten obrázek tlačil doleva?
|
||
margin Profil * |
#8 · Zasláno: 23. 3. 2013, 22:19:15
Nevím, jakkou máš představu, třebas takto:
http://jsfiddle.net/6FjtA/1/ http://fiddle.jshell.net/6FjtA/1/show/ Nebo takto: http://jsfiddle.net/6FjtA/2/ http://fiddle.jshell.net/6FjtA/2/show/ Pokud bys chtěl text vycentrovaný současně vertikákle i horizontálně, musel by se přidat další element, pokud by to musel být text vycentrován horizontálně i vertikálně také v IE6/7, bylo by to ještě složitější. |
||
xmark Profil |
#9 · Zasláno: 24. 3. 2013, 12:03:01
Takhle mi to vyhovuje. Díky moc. Prozkoumám, proč mně se to nedařilo.
|
||
Časová prodleva: 11 let
|
0