Bootstrap a order sloupců – CSS – Fórum – Programujte.com

Ahoj, potřeboval bych poradit, jak v Bootstrapu udělat, mám 3 sloupce  1, 2 a 3 na desctopu a potřeboval bych , aby v mobilním zobrazení byly pod sebou  sloupec 1, 3 a 2hý sloupec byl poslední pode všemi. Nenašel jsem bohužel žádný fungující návod, tak jestli prosím nevíte někdo tady. Děkuji

google = bootstrap column order

https://stackoverflow.com/questions/18057270/column-order-manipulation-using-col-lg-push-and-col-lg-pull-in-twitter-bootstrap

BT3: .col-pull-5 .col-push-5 (.col-vp-push-x .col-vp-pull-x) .col-lg-push-4
BT4: .order-2 .order-1 .order-first .order-last (.order-md-*)

https://getbootstrap.com/docs/4.0/layout/grid/#reordering
https://getbootstrap.com/…lities/flex/#…
https://getbootstrap.com/docs/4.0 - do policka sarch napises order (poradi sloupcu) a ono ti to neco najde. Hlavne to musis aspon zkusit. Nebo pouzij translator.google.com, napis tam poradi sloupcu, pak klikni, ze to chces v anglictine.

3s + 10 min psani odpovedi. Jak dlouho cekas na odpoved? 17h? Asi jsi to mohl najit rychleji googlem.

#1 shockwave
ahoj, koukám, že ti zatím nikdo neodpověděl, já web dlouho nedělal, ale zkusím alespoň trošku navést podle mé představy jak to funguje a dle https://www.willmaster.com/library/web-development/responsive-table-for-mobile.php

tam je ve stylu rozlišení podle ID na desktop a mobil a nastavení viditelnosti 

v PHP si pak musíš vytvořit 2 sekce DIV pro ty ID, v jednom generování tabulky pro desktop v druhém pro mobil,

pokud tabulku vyplňuješ z nějakého datového zdroje, tak u desktopu je 1 průchod - všechny sloupce najednou, pro mobil pak musíš podle rozložení sloupců udělat průchodů více pro každou část pod sebou.

viz https://stackoverflow.com/questions/25009984/how-to-split-a-html-table-by-columns-for-responsive-design

kde v těch vnitřních tabulkách provedeš ty cykly průchodu datovým zdrojem a "COLx" nahradíš položkami z datového zdroje.

To je má představa, možná to jde i jednodušeji, snad se ozve někdo zkušenější a upřesní. 

#3 MilanL Spis ho zajimala vymena poradi. Jakoze mas sloupce 1 2 3 a potrebuje je jako 1 3 a 2. 

#2 peter Ale milan ma pravdu v tom, ze mozna nemas ani ty sloupce. Zkusim to vysvetlit taky.
BT pro ruzne sirky okna rozlisuje velikosti nic, sm, md, lg, xl. Dale rozlisuje sirku 1-12.
https://getbootstrap.com/…layout/grid/
Pokud potrebujes, aby neco bylo sloupec na malem, sirka 3 a na velkem cely radek, sirka 12, pise se to takto:

class="col-12 col-md-4"

Pro vsechna zarizeni bude 12. Pro md, lg, xl 3. Pouzil jsem to na winrar.cz

class="col-12 col-sm-12 col-md-4 col-lg-3" // col-sm-12 tam nemusi byt, pro md chci 4 sloupce, pro lg 3 a xl take 3
class="col-sm-12 col-md-4 col-lg-3" // takto je to mozna prehlednejsi

No, a to poradi tim orderem.

Ups, v textu, kde mam sirku 3, tam ma byt 4. 
(ja to mel puvodne pro 3, ale pri editaci jsem tam chtel dat copy-paste kod a necham jsem tam 4 z winraru, promin)

#5 peter
no variant rozložení je více, v zadání by to chtělo trošku upravit, jak to opravdu má být seskupené,

bud to může být pod sebou za sloupec R1S1/R2S1/R3S1 - R1S3/R2S3/R3S3 - R1S2/R2S2/R3S2

pod sebou skupinově za řádku R1S1/S3/S2 - R2S1/S3/S2 - R3S1/S3/S2

kombinace předchozích R1S1/S3 - R2S1/S3 - R3S1/S3 -/- R1/S2/R2S2/R3S2

ještě možná může jít o přeorientaci tabulky - záměna řádek a sloupců tzn sloupce jsou v řádkách a řádky ve sloupcích

z

R1: S1 S2 S3 .. Sn
R2: S1 S2 S3 .. Sn
.
Rn: S1 S2 S3 .. Sn

na

S1: R1 R2 R3 .. Rn
S3: R1 R2 R3 .. Rn
S2: R1 R2 R3 .. Rn
.
Sn: R1 R2 R3 .. Rn

#2 peter
promin, s Googlem docela kamarádím, ale kdybych našel radu, tak bych se tady neptal. Je nutno někdy vzít v potaz, že holt někdy někdo radu nenajde a pak se ptá třeba tady. Děkuji ti