title: Bootstrap columns not working on mobile
body: <p>I have three coluns in on row and it works ok. I used col-xs-12 so the columns become rows when it goes to mobile. Its not working. Columns remain in one row</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"&gt;&lt;/script&gt;
  
  &lt;link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"&gt;
  &lt;script src="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"&gt;&lt;/script&gt;
  &lt;link rel="stylesheet" type="text/css" href="https://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css" /&gt;
  
  
  &lt;div class="content-footer"&gt;
        &lt;div class="container"&gt;          
               &lt;div class="row"&gt;
                   &lt;div class="col-xs-12 col-sm-4"&gt;
                        &lt;div class="footer-icon"&gt;
                                &lt;i class="fa fa-map-marker fa-lg" aria-hidden="true"&gt;&lt;/i&gt;
                                &lt;/div&gt;
                                 &lt;div class="footer-text-block" style="margin-left:100px;"&gt;          
                                 &lt;p&gt; 119180, Moscow &lt;br&gt;Malaya Yakimanka,3&lt;/p&gt;
                                                                &lt;/div&gt;
                   &lt;/div&gt;
                   &lt;div class="col-xs-12 col-sm-4"&gt;
                        &lt;div class="footer-icon"&gt;
                                &lt;i class="fa fa-envelope fa-lg" aria-hidden="true"&gt;&lt;/i&gt;
                                &lt;/div&gt;
                                 &lt;div class="footer-text"&gt;          
                                 &lt;p&gt;info@romeda-capital.com&lt;/p&gt;
                                                                &lt;/div&gt;
                   &lt;/div&gt;
                   &lt;div class="col-xs-12 col-sm-4"&gt;
                        &lt;div class="footer-icon"&gt;
                                &lt;i class="fa fa-phone fa-lg" aria-hidden="true"&gt;&lt;/i&gt;
                                &lt;/div&gt;
                                 &lt;div class="footer-text"&gt;          
                                    &lt;p&gt;+7 909 628 59 71&lt;/p&gt;
                                 &lt;/div&gt;
                   &lt;/div&gt;
               &lt;/div&gt;
        &lt;/div&gt;
    &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I incuded bootstrap from MaxCDN:</p>
  
  <pre><code>&lt;link rel="stylesheet" type="text/css" href="bootstrap-msg.css" /&gt;
  &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="bootstrap-msg.js"&gt;&lt;/script&gt;
  &lt;link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"&gt;
  &lt;script src="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"&gt;&lt;/script&gt;
  &lt;link rel="stylesheet" type="text/css" href="https://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css" /&gt;
  </code></pre>