Bootstrap row not occupying 100% width

css, html, twitter-bootstrap

Solution

Remove it from the `container`. The `container` is not 100% width, and shouldn't be nested in another container.

Problem

I have a bootstrap grid layout but the row is not occupying 100% width. I am using Bootstrap 4 alpha 6. Here is the HTML: ``` <div class="container-fluid"> <h1 class="center-text" id="heading">[Enter Heaading Here]</h1> <div class="container"> <div height="100px" class="row border-show"> <div class="col-4" id="one"></div> <div class="col-4" id="two"></div> <div class="col-4" id="three"></div> </div> </div> </div> ``` Here is the CSS: ``` .center-text{ text-align: center; } #heading{ padding: 60px; } .border-show{ border-style: solid; border-color: black; } ```

Original source