basicnested.html

<div class="container">
    <div class="row example">
        <div class="col-md-6 col-sm-6 col-xs-12 grey">
            <span class="ex-title">There are 4 columns that are each <pre class="inline-pre">col-md-3 col-sm-3 col-xs-3</pre> nested inside of this <pre class="inline-pre">col-md-6 col-sm-6 col-xs-12</pre></span>
            <div class="row">
                <div class="col-md-3 col-sm-3 col-xs-3 red">
                    Hi
                </div>
                <div class="col-md-3 col-sm-3 col-xs-3 blue">
                    how
                </div>
                <div class="col-md-3 col-sm-3 col-xs-3 yellow">
                    are   
                </div>
                <div class="col-md-3 col-sm-3 col-xs-3 green">
                    you 
                </div>
            </div>
        </div>
        <div class="col-md-6 col-sm-6 col-xs-12">
            <span class="ex-title">There are 4 columns that are each <pre class="inline-pre">col-md-3 col-sm-6 col-xs-12</pre> nested inside of this <pre class="inline-pre">col-md-6 col-sm-6 col-xs-12</pre></span>                        
            <div class="row">
                <div class="col-md-3 col-sm-6 col-xs-12 orange">
                    Hi
                </div>
                <div class="col-md-3 col-sm-6 col-xs-12 purple">
                    how
                </div>
                <div class="col-md-3 col-sm-6 col-xs-12 blue">
                    are   
                </div>
                <div class="col-md-3 col-sm-6 col-xs-12 green">
                    you 
                </div>
            </div>
        </div>
    </div>
</div>