Bootstrap 4 - Not breaking like in Bootstrap 3 : If I execute the following in bootstrap 3, then everything works as expected. But it does not break correctly in bootstrap 4. Please execute the examples below, the first runs with BS4 then last with BS3.

I expect it to look like in BS3.

    <div id="orange_containers" class="">
    
        <div class="row no-gutters">
            <div class="col-sm-6">
                <div class="col-sm-3">
                    <div class="icon">
                        A
                    </div>
                </div>
                <div class="col-sm-9">
                    <div class="text">
                        <h4>Test</h4>
                        <p>
                            I'm speaking with myself, number one, because I have a very good brain and I've said a lot of things. 
                            If Trump Ipsum weren’t my own words, perhaps I’d be dating it.
                        </p>
                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="col-sm-3">
                    <div class="icon">
                        B
                    </div>
                </div>
                <div class="col-sm-9">
                    <div class="text">
                        <h4>Test</h4>
                        <p>
                            The other thing with Lorem Ipsum is that you have to take out its family. 
                            We have so many things that we have to do better... and certainly ipsum is one of them. 
                            We are going to make placeholder text great again. Greater than ever before.
                        </p>
                    </div>
                </div>
            </div>
        </div>
    
    </div>

[Try Bootstrap 4 Example in Bootply][1] 

Same Example but Bootstrap 3:

https://www.bootply.com/i8pRUcI7nz


  [1]: https://www.bootply.com/CL6AQWfRcz