| 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: 13 let
|
|||
0