NOVINKA: Získej 40 hodin praktických dovedností s AI – ZDARMA ke každému akreditovanému kurzu!
Mezinárodní den IT společnosti je tady! Pouze nyní můžeš získat 90 % extra kreditů při nákupu od 1199 kreditů s promo kódem AJTACI90. Tak neváhej!

Diskuze: Bootstrap - veľkosť kontajneru

V předchozím kvízu, Online test znalostí HTML a CSS, jsme si ověřili nabyté zkušenosti z kurzu.

Jak se ti líbí článek?
Před uložením hodnocení, popiš prosím autorovi, co je špatněZnaků 0 z 50-500
Jak se ti kurz líbí?
Tvé hodnocení kurzuZnaků 0 z 50-500
Aktivity
Avatar
balaz.marek94
Člen
Avatar
balaz.marek94:2.1.2019 21:44

Zdravím,
mám stránku s bootstrap kontajnerom. Na mojom notebooku má šírku cca 1110px, pritom rozlíšenie celej obrazovky v prehliadači je 1295px. Potreboval by som ho zväčšiť aspoň na 1140px. Dá sa to nejak?

Zkusil jsem: Skúšal som klasické media query, ak je obrazovka väčšia ako 1200px, avšak nešlo (aj som to očakával).

 
Odpovědět
2.1.2019 21:44
Avatar
rosina.jakub
Člen
Avatar
rosina.jakub:2.1.2019 22:27

Myslím, že by malo stačiť toto:

.container {
  max-width: 1140px;
  width: 100%;
}
 
Nahoru Odpovědět
2.1.2019 22:27
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:3.1.2019 10:27

Tvuj dotaz nedava vubec smysl, protoze popira smysl pouziti bootrapu.
Jestli si prohlidnes dokumentaci a css, tak tam jsou definovane sirky sloupcu. Ty si samozrejme muzes prepsat, jak pise Jakub. Ale tim prijdes o vyhody a sladeni celeho BT.

Pokud tam tedy potrebujes jinou sirku, nepouzivej class, ktere maji definovanou sirku.
Prepisovani classu ma vyznam kvuli barvam. A dela se tak, ze si pridas vlastni css, kde tu konkretni class prepises.

https://getbootstrap.com/…ootstrap.css
ctrl+f (hledani v okne prohlizece)
a muzes si tam prohlednout, co ma definovane Bootstrap v4.2.1 pro tridu container. Mozna, ze to omezeni sirky tam mas z neceho jineho.

.container {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
@media (min-width: 576px) {
  .container {
    max-width: 540px;
  }
}

@media (min-width: 768px) {
  .container {
    max-width: 720px;
  }
}

@media (min-width: 992px) {
  .container {
    max-width: 960px;
  }
}

@media (min-width: 1200px) {
  .container {
    max-width: 1140px;
  }
}

/* --- */

.navbar > .container, ...

@media (max-width: 575.98px) {
  .navbar-expand-sm > .container, ...

...

  .container {
    min-width: 992px !important;
  }
Editováno 3.1.2019 10:27
 
Nahoru Odpovědět
3.1.2019 10:27
Avatar
Uživatel sítě
Tvůrce
Avatar
Odpovídá na balaz.marek94
Uživatel sítě :3.1.2019 13:16

Dle dokumentace:
https://getbootstrap.com/…layout/grid/#…

by měla být tvoje šířka 1140px. Nemáš tam ještě vlastní styl, který upravuje .container?

Nahoru Odpovědět
+1
3.1.2019 13:16
Chybami se člověk učí, běžte se učit jinam!
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 4 zpráv z 4.