Grid System not wrapping correctly?

Bootstrap Studio Help
1

Hello! I am currently learning how to use bootstrap and the tutorial I am following, it shows his grid system properly wrapping but mine isn't. Any help? I am using version 3.3.7

      <!-- GRIDS -->
  <div class="container">
    <div class="row">
        <div class="col-md-8">           
            <p>ROW 1</p>
        </div>  
        <div class="col-md-4">            
            <p>ROW 1.1</p>
        </div>  
    </div>
      <br>
    <div class="row">
        <div class="col-md-3">           
            <p>ROW 2 DASKLLLLDASSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSS</p>
        </div>  
        <div class="col-md-3">            
            <p>ROW 2.1 DASKLLLLDASSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSS</p>
        </div>  
        <div class="col-md-3">           
            <p>ROW 2.2 DASKLLLLDASSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSS</p>
        </div>  
        <div class="col-md-3">            
            <p>ROW 2.3 DASKLLLLDASSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSS</p>
        </div>  
    </div>  
  </div>
2

The "GRID" is wrapping. Your super long "word" is not wrapping because you've not applied any CSS to cause the word to wrap.

If you add the following CSS property to your columns (might be more ideal on the paragraph though) you want that super long word to wrap then you'll get what you were expecting to happen.

CSS3 word-break https://caniuse.com/#feat=word-break word-break: break-all

In use

.col-md-3 p {
    word-break: break-all;
}

Saj

3

Also, why using 3.3.7? You'll get a lot better features if you start out with BS 4 and since you're just learning it, why learn the older version only to have to then learn the new one? Just some food for thought. Things are different between 3.3.7 and 4, and 4 is definitely better. Give some thought to not wasting your time learning things that have been outdated already. :)