| Autor | Zpráva | ||
|---|---|---|---|
| unlucky Profil |
#1 · Zasláno: 20. 5. 2011, 00:18:21 · Upravil/a: unlucky
mám galerii, kde jsou obrázky v li za sebou. Všechny obrázky mají stejnou velikost a velmi podobné jméno (obrázek 001 až obrázek 555). Objevuje se ale problém, na určité stránce (stránka xx..) je na jednom řádku pouze 1 obrázek i přesto, že míst tam je spousta. Problémy mám od stránky cca od str 5 a více. V pager či skriptu to nemůže být, kontroloval jsem to a i ve zdrojovém kódu se shoduje s "funkčními" stránkami.
ul#gallery_list li {
max-width: 100px;
float:left;
display:inline;
background:none;
padding:0;
margin:0 4px 4px 4px;
overflow: hidden;
}
ul#gallery_list li a, ul#gallery_list li a:link, ul#gallery_list li a:visited {
float:left;
display:inline;
border:1px solid #e6e6e6;
padding:7px 7px 0 7px;
text-align:center;
font-weight:bold;
color:#565656;
line-height:1.4em;
}
ul#gallery_list li a:hover {
border:1px solid #565656;
text-decoration:none;
color:#343434;
}
ul#gallery_list li a img {
max-height: 110px;
max-width: 71px;
margin:0 0 3px 0;
}
|
||
| jenikkozak Profil |
#2 · Zasláno: 20. 5. 2011, 06:56:24
Přidej odkaz na živou ukázku.
|
||
| Railbot Profil |
#3 · Zasláno: 20. 5. 2011, 07:21:13 · Upravil/a: Railbot
unlucky:
- u <li> i <a> máš float, proč tedy ještě ten display:inline? Význam chápu u <li> pokud je to fix double margin bugu v IE6, u <a> smysl postrádá zcela. Mimochodem stačí ti selektor ul#gallery_list li a, nemusíš vypisovat další stavy jako link a visited. Chyba není nikde v kódu, ale jasně v různé výšce prvků, resp. nejspíš v odlišené výšce několika obrázků (o pixel). Pod kratší prvky se pak zalomí další prvek, ostatní pokračují na řádku dalším. Důkaz místo slibů, červená linka kopíruje dolní border u problematického prvku s obrázkem s jinou výškou (o pixel kratší/vyšší):
|
||
| Gappa Profil |
#4 · Zasláno: 20. 5. 2011, 07:21:58
Nic neblbne, poslední obrázek v prvním řádku je o pixel kratší a jelikož odkazy uvnitř li floatuješ, právě proto dojde nejspíš k tomuto zarovnání.
Tobě by se nejvíc asi hodil inline-block vertical-align: top; |
||
| unlucky Profil |
#5 · Zasláno: 20. 5. 2011, 09:57:27
chyba opravdu byla v tom, že sem tam byl obrázek o pixel větší, takže jsem musel přidat pár pixelu navíc :)
děkuji všem |
||
|
Časová prodleva: 15 let
|
|||
0