NOVINKA: Získej 40 hodin praktických dovedností s AI – ZDARMA ke každému akreditovanému kurzu!
S účinností od 26. 3. jsme aktualizovali Zásady zpracování osobních údajů – doplnili jsme informace o monitorování telefonických hovorů se zájemci o studium. Ostatní části zůstávají beze změn.

Diskuze: BOOTSTRAP | Problém s .container

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
Stivko
Člen
Avatar
Stivko:12.12.2019 20:59

Zdravím,

Mám takový problém a nemohu ho nějak rozumně vyřešit.
Potřebuji (hodně zjednodušeně) vedle sebe fotografii a text, nicméně fotografii potřebuji, aby začínala se stránkou, ale text končil společně s contentem v .container(viz obrázek níže).

ZKoušel jsem to vše hodit do .container-fluid a šířku textu zmenšit, aby byl zarovnán s contentem. Bohužel to pak nefunguje při responsibilním zobrazení, protože se to posouvá a já to musím mít pořád zarovnáno. Také jsem zkusil kombinovat .container-fluid a .container, ale měl jsem problém s responsibilitou a nastavením media query od bootstrapu. Také jsem zkusil flex, ale ten mi ten text spolu s obrázkem posouval.

Nutně potřebuji, aby text byl vždy seřazen s contentem (tzn. vpravo, druhý případ vlevo) a při změně rozlišení byl text stále na stejné pozici s contentem.

Snad jsem to dostatačně vysvětlil. Budu velmi rád za každé rady, děkuji.

Odpovědět
12.12.2019 20:59
Nikdy není pozdě začít s něčím novým
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:13.12.2019 8:14

Tohle nejde rozumne vyresit. Kdyz je neco uvnitr, tak to nevyteka ven.
Jedine, jak by to slo resit je uzavrit stranku do divu, ktery nema class container, a cele to roztrhat.

- div
- container
- container > maincontent
- container
- obrazek | text
- container
- text | obrazek
- container
- konec divu

Nebo muzes pouzit zaporny margin pro obrazek uvnitr. Jenze nevis kolik mas ten margin dat.
A dalsi moznost je pouzit pozicovani, jenze pak zas nevis, kolik mas dat sirku textu.
Problem totiz spociva v tom, ze stranka nema definovany rozmer, kdezto container ano.

meni se pevna-container meni se

Takze jedine rozumne reseni je container nepouzit vubec a okraje stranky definovat na pevnou sirku. Teda, pokud chces dynamicky layout. To je tak, kdyz grafik ti navrhne pikacovinu, protoze nerozumi html, css a je linej si to behem 1-2 hodin nastudovat :)

pevna-mezera meni se stred pevna-mezera
Akceptované řešení
+20 Zkušeností
+2,50 Kč
Řešení problému
 
Nahoru Odpovědět
13.12.2019 8:14
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:13.12.2019 8:16

A jeste by slo pouzit javascript (bt jquery) na dopocitani, pokud netrvas na css.

(hlavne ten navrh je uzivatelsky spatny. Na to prijdes, az ti budou pindat uzivatele, kdyz ti css spravne nebude fungovat pri ruznych sirkach)

Editováno 13.12.2019 8:17
 
Nahoru Odpovědět
13.12.2019 8:16
Avatar
Stivko
Člen
Avatar
Odpovídá na Peter Mlich
Stivko:13.12.2019 20:06

Ahoj, díky za odpověď.
Taky jsem grafika nepochopil a není to jediné, co v návrhu je trochu "mimo".

Nahoru Odpovědět
13.12.2019 20:06
Nikdy není pozdě začít s něčím novým
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.