There is a code:

<div class="container"> <div class="row"> <div class="col-md-3"> <div class="row"> <div class="col-md-12"> right side </div> </div> </div> <div class="col-md-3 text-center"> </div> <div class="col-md-3 text-center"> </div> <div class="col-md-3 text-center"> </div> <div class="clearfix"> </div> <div class="col-md-3 text-center"> </div> <div class="col-md-3 text-center"> </div> <div class="col-md-3 text-center"> </div> <div class="col-md-3 text-center"> </div> </div> </div>

How to make the right side text be for the entire length of the content, while the following div after the div class = "clearfix" flowed around it?

  • in what sense to flow around if it is full length? - apelsinka223
  • The length of the right diva (the one with col-md-12) is large. maybe 2 screens, respectively, the remaining 3 divas have the same length and the rest of the content (the one after clearfix) floats down the page. this is the crux of the problem. how to avoid it ... - deni5n
  • figured it all out was easy. you need to make two columns in .row .col-md-9 and .col-md-3. In the .col-md-9 column, you need to attach another .row and in it the required number of columns in accordance with the layout. - deni5n
  • 2
    @ deni5n, if not difficult, please issue a final comment with the answer. - Nofate ♦
  • @Nofate done. - Nick Volynkin ♦

1 answer 1

The answer from the author's comment:

Everything turned out to be simple. You need to make two columns in .col-md-9 and .col-md-3 . In the .col-md-9 column, you need to attach another .row and in it the required number of columns in accordance with the layout.