title: Bootstrap col-xs-12 in HTML is not taking full width
body: <p>I've created a simple button link in my page with <code>container-fluid</code> and <code>row</code> classes so that I can take utilize the whole available width of the page for the link button.</p>
  
  <p>However, my code doesn't result in the button taking full width of the page. Attached is the screenshot of the said output.</p>
  
  <p>Please inform me as to what I'm doing incorrectly. Thanks in advance.</p>
  
  <p>[Basically what I want is that the well in the below screenshot should take 100% (or atleast 90% and centered) of the page width.]</p>
  
  <p>My HTML and CSS codes are mentioned below:</p>
  
  <p><a href="https://i.stack.imgur.com/fAZ0H.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/fAZ0H.png" alt="Screen shot"></a></p>
  
  <p><strong>My HTML Code:</strong></p>
  
  <pre><code>&lt;div class="container-fluid"&gt;   
              &lt;div class="row"&gt;
                  &lt;section id="access_list_session" class="col-sm-12"&gt;
                      &lt;br/&gt;
                      &lt;p id="form-header"&gt; Access Colleague List &lt;/p&gt;
                          &lt;br /&gt;&lt;br /&gt;&lt;br /&gt;
                          &lt;div class="row"&gt;
                              &lt;div class="hidden-xs hidden-sm col-md-4"&gt;
                                  &lt;i class="fa fa-5x fa-cogs" aria-hidden="true"&gt;&lt;/i&gt;
                              &lt;/div&gt;
                              &lt;div class="well col-xs-12 col-sm-12 col-md-8"&gt;
                                  &lt;div id="form_link"&gt; 
                                      &lt;a href="xyz.php" class="btn btn-lg btn-primary btn-block" style="text-color: blue;"&gt;&lt;i class="fa fa-list-alt" aria-hidden="true"&gt;&lt;/i&gt; Click to access our Colleague List&lt;br /&gt; &lt;span style="font-size: 10px; text-align:center;""&gt;(Use of this list is subject to our Privacy Policy and other T&amp;C)&lt;/span&gt; &lt;/a&gt;
                                  &lt;/div&gt;
  
                                  &lt;br/&gt;
                                  &lt;hr&gt;
                                  &lt;p&gt; In case of any difficulty please contact the site administrator using the form below.&lt;/p&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
  
                  &lt;/section&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  </code></pre>
  
  <p><strong>My CSS Code</strong></p>
  
  <pre><code>#form_link a
  {
      width: 100%;
      font-size: 1em;
  }
  
  .row
  {
      padding-top: 60px;
      height: 60em;
      width: 100%;
  }
  </code></pre>