Mikuláš je tu! Získaj 90 % extra kreditov ZADARMO s promo kódom CERTIK90 pri nákupe od 1 199 kreditov. Len do nedele 7. 12. 2025! Zisti viac:
NOVINKA: Najžiadanejšie rekvalifikačné kurzy teraz s 50% zľavou + kurz AI ZADARMO. Nečakaj, táto ponuka dlho nevydrží! Zisti viac:

Diskusia – 11. diel - Grid systém Bootstrapu

Späť

Upozorňujeme, že diskusie pod našimi online kurzami sú nemoderované a primárne slúžia na získavanie spätnej väzby pre budúce vylepšenie kurzov. Pre študentov našich rekvalifikačných kurzov ponúkame možnosť priameho kontaktu s lektormi a študijným referentom pre osobné konzultácie a podporu v rámci ich štúdia. Toto je exkluzívna služba, ktorá zaisťuje kvalitnú a cielenú pomoc v prípade akýchkoľvek otázok alebo projektov.

Komentáre
Avatar
KaMl
Člen
Avatar
KaMl:19.8.2021 19:39

Ta poslední ukázka s mezerou funguje na staré CDN (4.5.0 - co je na začátku lekce k překopírování).
S novým CDN (Bootstrap 5.1.0) to zdá se nefunguje... :-?

V každém případě super lekce! Díky :-)

Avatar
Odpovedá na KaMl
Neaktivní uživatel:3.9.2021 9:13

Ano, je to z důvodu breaking změn ve verzi 5.x.
viz: https://getbootstrap.com/…0/migration/#rtl

Nelze už nyní používat l a r, jakožto left & right. Od nové verze je to s a e, jakožto start & end.

Podobně byla změněna i třída .no-gutters a určitě ještě některé, kterých jsem si při letmém nahlédnutí do dokumentace nevšiml.
Právě proto je v úvodu článku URL s verzí, se kterou je článek napsaný, aby nedocházelo k nedorozuměním.

Odpovedať
Neaktivní uživatelský účet
Avatar
Jaroslav Drobek:5.4.2022 12:10

S použitím aktuální i původní verze dochází k podivnému paddingu u prvního sloupce:

Editované
Avatar
Jaroslav Drobek:5.4.2022 13:03

Hodnocení:

  • Na odkazované oficiální stránce Bootstrapu nenajdeme odkaz na aktuální (5.1.3.) ale dřívější (4.5.3) verzi.
  • Psychologie zlomků je neúprosná: čím více různých jmenovatelů, tím větší zmatek - takže to se u popisu prvního výsledku povedlo.
  • Když už víme, že "Některé HTML elementy nelze jako flex kontejnery zatím použít", jak vlastně vypadá použití pro jiný než <div> element?
  • "bug" je chyba?
Avatar
Jaroslav Drobek:5.4.2022 13:05

Hodnocení (pokračování):

  • "Co bychom měli vědět" o gutterech nám zrovna předchozí "Výsledek" moc nepotvrzuje (tedy pokud autor nezatajil nějaké další stylování, třeba pro <body>): krajní sloupce a okolí mezi sebou mezeru mají..
  • "Automatická šířka": proč najednou jiné značení - podle toho dosavadního je to přece .col-X-auto?
  • Když je mix sloupců a mezi nimi několik s třídou col, pak tyto (a ne nějaký jeden) přece vyplní zbylé místo!
  • Význam zápisu těchto dvou tříd za sebou col col-sm-4 použitý v kódu pro "Živá ukázka" není vysvětlen, stejně jako obalení elementem <div class="container-fluid">.
  • Takže element "se třídou .row" se rozumí element, který tuto třídu má v <div> a dále každý jeho podelement?
Avatar
Lubor Pešek
Člen
Avatar
Lubor Pešek:13.6.2022 15:10

Nevím, jestli to někdo z vás zkoušel i na mobilu, ale s meta tagem

<meta name="viewport" content="width=device-width, initial-scale=1.0" />

Se mi to sice v prohlížeči i v mobilním rozlišení ve vývojářském prostředí zobrazuje správně, ale na mobilu se mi řádky zarovnaly pod sebe.
Po odstranění tohoto meta tagu mi i na mobilu vše běželo ok.
Tak jen taková zmínka, co se mi stalo.

Odpovedať
Existují dva způsoby, jak vyřešit problém. Za prvé vyhoďte počítač z okna. Za druhé vyhoďte okna z počítače.
Avatar
Natálie Savčenko:10.7.2024 22:56

V části Co bychom měli vědět máte větu "Aby grid systém fungoval, musí být vždy
všechny přímé podelementy řádků sloupce." Co musí být vždy? Dále v části Zarovnání a změna pořadí uvadíte třídu .align-items-center, ale v kódu máte .align-self-center. Co z toho je správně? No a v části Offsety máte větu "Abychom se vyhnuli jeho zbytečné deklaraci v kódu, nemusíme
prázdný sloupec vkládat vůbec a následující sloupec a kus posunout." Asi tam má být "o kus" a ne "a kus".

Avatar
Marek Němec
Člen
Avatar
Marek Němec:26.7.2024 17:21

nevim no, osobne se mi zda lepsi si nadesignovat vlastni css grid do tridy kterou potom aplikovat na deset gridu ktere byste na strance mohli mit... takto musite kopirovat z html...

Robíme čo je v našich silách, aby bola tunajšia diskusia čo najkvalitnejšia. Preto do nej tiež môžu prispievať len registrovaní členovia. Pre zapojenie sa do diskusie sa zaloguj. Ak ešte nemáš účet, zaregistruj sa, je to zadarmo.

Zobrazené 8 správy z 8.