Přidat otázku mezi oblíbenéZasílat nové odpovědi e-mailem Jak HTML tabulku(Celou) rozdělit do sloupců (jako CSS3 column-count:3)

Potřeboval bych HTML tabulku rozkouskovat na několik sloupců (myslím tím tabulku jako celek, tedy vnitřní sloupce tabulky TD zůstanou pohromadě), podobně, jako lze pomocí CSS3 rozdělit například dokument do sloupců pomocí column-count.
"Selsky řečeno, aby tabulka o 97 řádcích TBODY + 1 řádku THEAD a 3 sloupcích (Město, PSC, kraj) nebyla vysoká úzká nudle, ale aby byla zhruba 3x nižší , ale 3x širší(+ místo na mezery - jako column-gap) — o 33 řádcích , zato jakoby 3x vedle sebe"
Avšak cloumn-count se prý nedá použít právě pro tabulky (v popisu dokumentace) a tudíž mi to ani nejde.

Jak to udělat? do html není možné zasahovat, kromě nějaké triviálního přidání atributu, pokud by to šlo (něco jako TABLE columns)

Jako taková třešnička na dortu, aby se záhlaví THEAD zobrazovalo v každém ze tří super-sloupců

— Zkoušel jsem celou tabulku obalit do DIV, což částečně funguje, ale dělá to nehezké efekty: na hranách/krajích to zobrazuje duchy (prázdné řádky), případně někde chybí rámeček. zobrazení třešničky THEAD v každém sloupci to už vůbec neumí

Předmět Autor Datum
Osobne na to pouzivam Bootstrap, je to rychlejsi a pohodlnejsi. * V pripade ze jich ches pouzit treb…
XoXoChanel 06.09.2018 10:10
XoXoChanel
Osobne na to pouzivam Bootstrap, je to rychlejsi a pohodlnejsi. platilo v minulosti, možnosti ktoré…
Mlocik97 07.09.2018 16:20
Mlocik97
Na to jsi dosel jak ? Flexbox/ gridflex je jen "modul" CSS, Bootstrap je kompletni "Framework" , tak…
XoXoChanel 07.09.2018 16:26
XoXoChanel
Flexbox/ gridflex je jen "modul" CSS, Bootstrap je kompletni "Framework" , tak co vlastne porovnavat…
Mlocik97 07.09.2018 16:51
Mlocik97
do dokumentu není možné zasahovat–vysvětlím, Myslel jsem tím, že mám takto tabulku někde uloženou,…
prime Document 07.09.2018 16:01
prime Document
Proto je nesmysl radit django A nekdo ti ho tu radi ? /chytracci jsou nejlepsi ..
XoXoChanel 07.09.2018 16:23
XoXoChanel
k prvemu odseku: ja tabuľky parsujem z JSONu (buď Array a objekty alebo 2D array podľa potreby), vät…
Mlocik97 07.09.2018 16:25
Mlocik97
Prostě vstupní data je HTML řetězec s tabulkou. Taková vstupní data jsou mírně řečeno nezvyklá. Úko… poslední
hynajs 07.09.2018 23:17
hynajs

Osobne na to pouzivam Bootstrap, je to rychlejsi a pohodlnejsi.
* V pripade ze jich ches pouzit treba na tvych sytrankach vice.

ale aby byla zhruba 3x nižší , ale 3x širší

Vystrizek kodu by sel ? "do html není možné zasahovat" Jak nemuzes upravovat HTML code, co chces tedy delat ? Ten DIV jsi daval tedy kam kdyz né do HTML ? (to delas v Djangu nebo co ..)
TiP : https://www.w3schools.com/css/css3_multiple_columns.asp

Osobne na to pouzivam Bootstrap, je to rychlejsi a pohodlnejsi.

platilo v minulosti, možnosti ktoré ponúka flexbox a CSS Grid už ale bootstrap prekonali (a ostatné veci ktoré bootstrap ponúka už nie sú tak dôležité, a ani nieje problém také veci spraviť skrz CSS). Aj veci ktoré tazatel požaduje jde spraviť jednoducho skrz štandardné CSS (aj již zmínené Multi-column v CSS) (síce ja to neviem, ale ja som do CSS celkovo blbej, ostatne i ja som len s čistým CSS dokázal vytvoriť pomerne normálnu stránku s normálnym, samozrejme nieje to úplne suprové ale na to že som to delal ja, anti-talent do grafiky a grafického cítenia,... myslím že pre vätšinu ludí není problém).

Na to jsi dosel jak ?
Flexbox/ gridflex je jen "modul" CSS, Bootstrap je kompletni "Framework" , tak co vlastne porovnavat ?
* Nejsem si jisty, jestli jde jedno nebo druhé poravnat s udanim "lepsi".. FB je mozna rychlejsi protoze BS pouziva /float/, jak je to s kompatibilitou FB a strasima prohlizecama nevim, nepouzivam ho.
PS : Jinak spodni prispevek tazatele nejak nechapu co vlastne chce, jen si neco domysli "bych chtěl,bych chtěl,bych chtěl" a komplikuje co "bych chtěl" nebo co, nevim. S "magickym proutkem" musi do pohadky jestli chce aby to fungovalo.

Flexbox/ gridflex je jen "modul" CSS, Bootstrap je kompletni "Framework" , tak co vlastne porovnavat ?

Porovnávam to preto, lebo Bootstrap bol zväčša (tým myslím viac než hodne často, možno asi aj v 98% prípadoch cca) používaný práve s cieľom vytvoriť to, čo momentálne jde vytvoriť len pomocou čistého CSS (CSS 3), ktorý již obsahuje práve tieto "moduly" ako flexbox, CSS Grid a pod, je tu málo toho čo ponúka bootstrap čo by riešilo niečo, čo by bežným CSS nešlo spraviť jednoducho, resp. ak je tu pár takých vecí tak sú to skôr veci ktoré zriedka potrebujete, takže vo výsledku bootstrap v roku 2018 bych hodnotil tak že je zbytočne zneužívaný a používaný aj tam kde by vôbec ho nebolo potreba. Samozrejme sú situácie kde ho používať je viac než výhodné, ostatne i tak platí že vo vätšine prípadov a povedal bych aj v prípade tazateľovho problému je Bootstrap zbytočný (ak má Bootstrap použiť len pre túto tabuľku... [vetu si dokonči]).

Myslím že na netu je tucet hotových riešení, na ktoré keby sa tazatel pozrel, tak by nemusel ani toto vlákno zakladať. Ostatne problém je (aspoň sa mi zdá), jak si už aj ty popísal, tazatel ani nevie vyjadriť ani sa spýtať či už nás či už vyhladávača že čo vlastne chce, mám pocit že sám nevie čo chce.

do dokumentu není možné zasahovat–vysvětlím, Myslel jsem tím, že mám takto tabulku někde uloženou, nechci ji nějak parsovat a přeformátovávat, nedej bože počítat počet řádků. (I když to je možná těžké si představit , prostě nejde o nějaká dynamická data, co framework vloží do šablony a tam bych si v šabloně nějak ošetřil rozdělení na sub tabulky. []Prostě vstupní data je HTML řetězec s tabulkou.[/b])

Obalení tabulky do DIVu (nebo nalezení ancestora, který tabulku pojímá) je jakš takš ještě přijatelné. I když nejjednodušší řešení, co jsem myslel, je že dám do dokumentu nebo sdíleného CSS pravidlo TABLE.sloupeckova {partitionize-columns:4 } a jako magickým proutkem se všechny tabulky s touto třidou rozkouskují ve všech dokumentech.

Proto je nesmysl radit django (což je serverová věc, tam dotaz vůbec nemíří ; další důvod, že dotaz se týká vizuální prezentace dat, která jsout tabulková například dump databáze a nehci tedy do HTML nějak přikazovat strukturu ), ani Bootstrap (resp ano ,pokud bych de dozvěděl, jakou třídu mám dáta tabulce, aby se takto rozkouskovala, já bych se podívat do zdrojáku bootstrap.css a viděl bych, co daná třída nastavuje, takže bych se do dozvěděl nepřímo.

Navíc další důvod proti, jak by sis představoval, že bych měl to HTML upravit, když bych chtěl místo fixního počtu sloupců mít fixní šířku tabulky , takže "by se responzivně" tabulka fragemntovala podle šířky okna.

k prvemu odseku: ja tabuľky parsujem z JSONu (buď Array a objekty alebo 2D array podľa potreby), vätšinou nemusím vôbec rátať riadky ani nič, za všetko sa mi postará 3 riadky JavaScriptu s využitím Angularu a jQuery. Ak nejde o žiadny nemenný "bazmek" typu hotový plugin pre nejaký šablonovací systém, tak neviem kde je problém urobiť totéž.

k tretiemu odseku, nikto tu django neradil.

k štvrtému odseku: toto rieši aj to čo som popísal v prvom riadku, neco pridám do JSONu a ono hned sa mi pridá stĺpec ale ceľková šírka tabuľky sa nezmení, tú šírku definujem v CSS (stĺpce sa tzv. Squishujú, pridanie stĺpca teda nezmení rozmer ceľkovej tabuľky). Ukážka: https://codepen.io/chriscoyier/pen/xFcrp

trebárs si pridaj stĺpecc tak že skopíruješ siedmy riadok a vložíš ho hneď za tento siedmy riadok. Classy Row-[$číslo] si nemusíš všímať (vôbec nič nerobia). Ak tie dáta budeš parsovať z JSONu a využiješ 3 riadky JS, tak nebudeš musieť vôbec počítať počet riadkov, ani stĺpcov, ani nič. Len pridáš jednoducho hodnotu ktorú budeš potrebovať pridať alebo zmeníš hodnotu ktorú budeš potrebovať zmeniť. v 2D array to bude v podstate samo o sobe akoby tabuľka.

Prostě vstupní data je HTML řetězec s tabulkou.

Taková vstupní data jsou mírně řečeno nezvyklá.
Úkol je tedy vytvořit z HTML tabulky jinou HTML tabulku (jiné HTML tabulky) s tím, že

do html není možné zasahovat, kromě nějaké triviálního přidání atributu, pokud by to šlo (něco jako TABLE columns)

Neumím.
Zato jako vinař vím určitě: z plesnivých hroznů dobré víno neuděláš.

Zpět do poradny Odpovědět na původní otázku Nahoru