In general, I sit stupid. I tried many things, but the right decision never came to me. Most likely, everything is very simple, but alas, ah.

It should be: enter image description here

I am writing using the Bootstrap 4 grid. I don’t know how to position the background correctly. It should be two-color. This should extend beyond the limits of the bootstrap container. And accordingly, everything else should be in the container. How to arrange objects inside - I know. Problems with the structure of the code in html for a two-color background on a single row.

    1 answer 1

    One of the possible options, I think you will understand the idea:

    .wapper { background: linear-gradient(to left, #37d0e8 50%, #f4a142 0); } .col-sm { border: 1px solid red; } 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous"> <div class="wapper"> <div class="container"> <div class="row"> <div class="col-sm"> One of two columns </div> <div class="col-sm"> One of two columns </div> </div> </div> </div>

    • Excellent thank you. I completely forgot about the gradient :( - Denis Donya