Bootstrap Col-sm Making Content Disappear

When I add col-sm-* to any of my left or right columns the content completely disappears. With developer tools it looks like the areas are where they are suppose to be, but there i

Solution 1:

It's your markup, you have it abit wrong.

.row is meant to be a child of .container / .container-fluid.

So instead of:

<div id="bottomSection" class="container-fluid row">
...
</div>

make it

<div id="bottomSection" class="container-fluid">
    <div class="row">
        <div class="col-sm-8">
         ...
        </div>
        <div class="col-sm-4">
         ...
        </div>
    </div>
</div>

Also you don't need to do .col-md-8 if your sm column is also going to also have 8 grids, you can use just .col-sm-8 and on md screens it will also take that width.