The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Help debugging bootstrap columns that are clearing

  • This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
  • #203661

    For some reasons these bootstrap columns are not stacking up properly. Sometimes it works, but sometimes if I change some of the text inside one of the divs it throws off a seemingly unrelated column div.

    Here is a live version of the page

    Here is the html for each column:

    <div class="col-lg-4 col-md-6 col-sm-6 bottom-pad">
      <div class="content-box ch-item">
         <div class="ch-info-wrap">
            <div class="ch-info">
               <div class="ch-info-front ch-img-1"><i class="fa fa-arrows-alt"></i></div>
               <div class="ch-info-back">
                  <i class="fa fa-arrows-alt"></i>
         <div class="content-box-info">
            <h4 class="">Brand Strategy</h4>
                What’s your strategy to win customers?
    </div><!-- close col -->

    They should be 3 columns to a row, but something is making some of them clear.


    Thanks Senff. I noticed there is a problem with that solution. Because it’s responsive when the user resizes the screen it goes to 2 to a row.

    i tried adding this but it didn’t work.

    .services .container .col-md-6:nth-of-type(2n+1){
Viewing 2 posts - 1 through 2 (of 2 total)
  • The forum ‘CSS’ is closed to new topics and replies.