Poradí mi prosím někdo? Nejsem schopen vymyslet jak napsat aby #left měl background image až do kraje obrazovky. Obrázek by měl být samozřejmě nedeformovaný a měl by sahat až dolů, tam kde končí "Hodně dlouhý text". Díky moc.
<div class="container">
<div class="row">
<div class="col-6" id="left">
Krátký text
</div>
<div class="col-6" id="right">
Hodně dlouhý text
</div>
</div>
</div>
Ten bg by si měl dát na container a udělat to tak ať začíná v levo (0) a končí uprostřed (50%). To mi přijde jako nejjednodušší.
container má max-width, nejde až do kraje...nebo radu nechápu. Kdyžtak kód zde https://codepen.io/Sipal/pen/abbmRjb
Použijte container-fluid a vynulujte mu padding.
Něco sem narychlo vytvořil zde: https://codepen.io/dominik-wbz/pen/QWWKJzW
@RadekKoder - potřebuji container kvůli layoutu
@webiz.cz - díky, ale nefachá to, obrázek přelézá do spodního divu
Nakonec jsem to nějak vyhackoval přes relative wrapper a absolute img, overflow-x: hidden, padding-left: 500px a margin-left: -500px. Je to divočina,obrázek je tím pádem natažený i mimo screen, ale nejlepší co jsem zatím dokázal.
Myslel jsem to takto:
<div class="container-fluid><!--zde aplikovat pozadí-->
<div class="container>
<!--zde dát layout-->
</div>
</div<!--end container-fluid-->
Tedy container obalit container-fluid :) Akorát nevím, zda chápu váš záměr.
Chápu, ale tahle nenastavím background jen v tom levém sloupci. Nebo to neumím. Další problém by pak byl s responzivitou, až se mi pravý sloupec zalomí, tak by to asi nevypadalo dobře. Nicméně, nakonec jsem to vyřešil korektně, přes calc si spočítám potřebný margin a padding wrapperu a funguje to krásně i s responzivitou. Každopádně díky za návrhy.
