| Autor | Zpráva | ||
|---|---|---|---|
| repporello Profil * |
#1 · Zasláno: 20. 11. 2018, 10:22:26
Ahojte,
Je nejako možné nastaviť, keď mám inline zoznam , aby sa každé nasledujúce LI zasunulo pod to predchádzajúce? Nech skúšam ako skúšam, vždy mi to dopadne takto: 
&:not(:first-of-type) {
margin-left: -2rem;
padding: 0 1.2rem 0 2.4rem;
}Ďakujem |
||
| pcmanik Profil |
#2 · Zasláno: 20. 11. 2018, 11:40:52
repporello:
Nastav im position: relative; A postupne znižuj z-index. Tj. Položka 1 bude mať z-index: 4, položka 2 z-index: 3, položka 3 z-index: 2 a položka 4 z-index: 1 |
||
| repporello Profil * |
#3 · Zasláno: 20. 11. 2018, 13:29:56
pcmanik:
Dík, ale nedá sa to nejako zautomatizovať? Lebo môže sa stať, že tam tých položiek bude 100. |
||
| blaaablaaa Profil |
#4 · Zasláno: 20. 11. 2018, 14:08:28
repporello:
Na tohle je css kratke, takze bud to lze castecne zautomatizovat v preprocesoru (s danym max konecnym poctem prvku) nebo z-index nastavovat pomoci js. |
||
| RastyAmateur Profil |
#5 · Zasláno: 20. 11. 2018, 14:12:41
A nešlo by to prostě jen obrátit? Že by se ty položky rovnaly vpravo a celý ten seznam by se pak zarovnal nalevo. Jediné, co by byl problém, že v DOMu by musely být také naopak (tj. první by byla položka 4 a poslední položka 1), což už je ale asi trivialita. Případně s flexama se dají udělat všelijaké blbosti...
|
||
| Kajman Profil |
#6 · Zasláno: 20. 11. 2018, 14:39:15
Případně může být z-index přímo vepsaný do atributu style při generování seznamu.
|
||
| Kcko Profil |
RastyAmateur:
A ve flexu by jsi tohohle chtěl docílit jak jako? Řešení jsou jen 3: 1) Javascriptem dosadit z-index 2) Dosadit z-index inline-stylem 3) V preprocessoru si vygenerovat větší množství položek a inkrementovat z-index (nemusíš ani dělat v preprocessoru, můžeš si to vygenerovat někde bokem JS / PHP a do CSS souboru vložit). (JS řešení: jsbin.com/yukicecide/edit?html,css,js,output |
||
| RastyAmateur Profil |
#8 · Zasláno: 20. 11. 2018, 17:11:40
Kcko:
Byl to jen nápad, že pomocí flex-direction: row-reverse; by to možná mohlo jít prohodit tak, aby nemusel otáčet ty elementy v DOMu.
Každopádně k tvému seznamu přidám bod 4) obrátit ten DOM a vyřešit to čistým csskem (ukázka) |
||
| Tomášeek Profil |
#9 · Zasláno: 20. 11. 2018, 20:50:48
RastyAmateur:
Změna pořadí položek v HTML kódu, jen kvůli tomu, že se mají obráceně překrývat, je nesmysl. HTML se tvoří dle logiyk dokumentu, ne podle zamýšleného vizuálního zobrazení. repporello: Možností je více, nejsnažší z nabízených je inline styl při generování položek. Pokud je generuješ v cyklu, nastavuj z-index na hodnotu třeba 100-$i, kde $i bude index položky (rostoucí, čili z-index klesající). Pokud může být položek ještě více, odečítej třeba od dvoustovky.
|
||
| Kcko Profil |
#10 · Zasláno: 20. 11. 2018, 21:49:41
|
||
| pcmanik Profil |
#11 · Zasláno: 20. 11. 2018, 22:22:32
Kcko:
V Safari aj Chrome sa mi to zobrazuje ako na obrázku v[#1]. |
||
| Tomášeek Profil |
#12 · Zasláno: 20. 11. 2018, 22:31:50
Kcko:
Mno, popravdě, nevidím tam nic, co by mělo způsobit chtěné chování. Nezapomněl jsi na něco? :-) |
||
| Kcko Profil |
#13 · Zasláno: 20. 11. 2018, 23:05:25
pcmanik, Tomášeek:
Ano, protože jsem idio* a topic jsem vůbec nečetl, podíval jsem se na obrázek a myslel jsem, že to je chtěný výsledek, radši už jdu dneska spát :-) |
||
|
Časová prodleva: 5 let
|
|||
0